jquery - jQuery: すべてを見つけて変更します。おそらく「これ」がどこかにありません

Question

基本的に、特定のノード値を持つ Web サイト内の各要素を見つける必要があります。各 に .roll クラスを追加し、ノード内に新しい を追加します。

これが私がやりたいことの例であり、何が間違っているか: http://jsfiddle.net/7Zuax/2/

HTML:

<a href="#">link 1</a>
<a href="#">link 2</a>
<a href="#">link 3</a>
<a href="#">link 4</a>

CSS:

.red {
    background: red;
}

JS:

// add .red to each <a> element
$('a').addClass('red');
// add a new <span> child into each found <a> element, but with the current <a>'s html();
$('a').html("<span data-title="+$('a').text()+">"+$('a').html()+"</span>");

// Why does all of the links have 'link 1' instead of 'link 1...2...3...4' ? ---->

結果: リンク 1 リンク 1 リンク 1 リンク 1

Answer 1

各要素にいくつかのコードを適用するために使用できますeachが、最も直接的な方法は にコールバックを渡すことhtmlです:

$('a').html(function(_,h){
     return '<span data-title="'+$(this).text()+'">'+h+'</span>';
});