JQueryでクラス名で全要素を取得する

質問

javscriptとjqueryを学ぶ過程で、Googleのページを通過しましたが、これが動作するように見えることはありません。基本的に私はクラスのinnerhtmlを収集しようとしています、jqueryはプレーンなjavascriptよりも提案されているようです、document.writeに。

以下はこれまでのコードです。

<div class="mbox">Block One</div>
<div class="mbox">Block Two</div>
<div class="mbox">Block Three</div>
<div class="mbox">Block Four</div>

<script>
var mvar = $('.mbox').html();
document.write(mvar);
</script>

これだと、document.writeの下に1つ目のクラスしか表示されません。ブロック1、ブロック2、ブロック3のようにまとめて表示するにはどうしたらよいでしょうか？私の最終的な目標は、ブロック 1、ブロック 2、ブロック 3、ブロック 4 のようにカンマで区切って表示することです。ありがとうございます、関連する質問の束は出てきますが、これほど単純なものはないようです。

どのように解決するのですか？

可能な方法のひとつは .map() メソッドを使うことです。

var all = $(".mbox").map(function() {
    return this.innerHTML;
}).get();

console.log(all.join());

DEMOです。 http://jsfiddle.net/Y4bHh/

N.B. を使用しないでください。 document.write . テスト用に console.log が最適な方法です。