jQuery：データで要素を見つけることができません

Question

私はテーブルの内容を取得するためにAJAXを使用してテーブルを構築しています。そのページを移動するために、私はブートストラップのページ分割コンポーネントを使用しました。ページネーションもJSで構築され、構成要素は、このループ内に挿入されている：ユーザーが能動素子は対応するものに切り替えなければならない別のページに移動

for (i = 1; i <= pageCount; i++) { 
    var li = $("<li>"); 
    li.append($("<a>").attr("href", "#").data("page", i).html(i)); 
    li.appendTo("ul.pagination"); 
} // end for (i = 1; i <= pageCount; i++) 

場合。残念ながら、私はまた、この他の場所を必要とするので、ハンドラはオプションではありません「クリック」で$(this)を使用して

$("ul.pagination li.active").removeClass("active"); // works fine 

。
だから私は、私はここで見つけるソリューション変更された：私は、コンソールに結果の要素（複数可）を検査しようとすると

$('ul.pagination li a[data-page="' + page + '"]').parent().addClass("active"); 

：これは（私はいくつかのバリエーションを試してみました）私のために動作しませんでしたhttps://stackoverflow.com/a/4191718/6087532
を私はいつも結果を得ていませんでした。

私は.eachを使用して回避策を見つけました：

$('ul.pagination li a').each(function(index, element) { 
    if ($(this).data("page") == page) { 
    $(this).parent().addClass("active"); 
    } 
}); 

しかしa）は、このソリューションは非常にエレガントで、おそらく遅くはないと、b）私は私が間違って何をしたかを把握することはできませんので、これは真剣に私を悩ませています。

Answer 1

jQuery .data()とHTML属性data-***は同じではありません。

は、だから、これを使用する場合：

for (i = 1; i <= pageCount; i++) { 
    var li = $("<li>"); 
    li.append($("<a>").attr("href", "#").attr("data-page", i).html(i)); 
    li.appendTo("ul.pagination"); 
} // end for (i = 1; i <= pageCount; i++)