配列をeach()関数を使ってイテレーションする

each()関数は配列のiterationに使われます。

配列/オブジェクトを問わずに汎用的に用いることができる、繰り返し処理用の関数です。
この関数は、jQueryオブジェクトのプロトタイプに実装されている $().each() とは異なります。こちらは、引数で渡した単なる配列やjQueryでないオブジェクトも繰り返し操作することができます。
コールバック関数は2つの引数を持ちます。
1番目はオブジェクトであればハッシュKEY、配列であればインデックスを受け取ります。
2番目には、値が受け渡されます。

http://semooh.jp/jquery/api/utilities/jQuery.each/object,+callback/

サンプルを見てみましょう。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>each()を使ってループ</title>

<script src="js/jquery-1.11.1.js"></script>
<script>
$(document).ready(function() {
	var values = ['asami','aya','yuka','tamami'];

	$.each(values, function(index, value) {
		values[index] = value.toUpperCase();
	});

	$('p').each(function(index, el) {
		$(el).prepend(' - ');
	});

	$('p').each(function(index) {
		$(this).prepend(values[index]);
	});
});
</script>

</head>
<body>
<h2>each()を使ってループを回す</h2>
<p>1番目</p>
<p>2番目</p>
<p>3番目</p>
<p>4番目</p>
</body>

これをブラウザで開くと以下のような画面が見えます。
f:id:sho322:20140504170209j:plain