jquery - jQueryでクラスを選択し、個別のクラスを数値的に追加する方法

Question

jQuery を使用して (私は完全な初心者なので少し難しい)、ページ上のクラスを選択し、その順序に応じて異なるクラスを追加しようとしています。

例：

<article class="news-story">
</article>
<article class="news-story">
</article>
<article class="news-story">
</article>
<article class="news-story">
</article>

jQuery ですべての「news-story」クラスの要素を取得し、「customclass1」を最初に、「customclass2」を 2 番目に、「customclass3」を 3 番目に、「customclass4」を 4 番目に追加します。

誰でもこれで私を助けてくれますか?

もしそうなら、PC を蘇生させたらすぐに jQuery と PHP を頭が回転するほど詰め込むことを約束します。

前もって感謝します。

Answer 1

addClass()メソッドの引数を使用できます。

$(".news-story").addClass(function(i) {
    return "customclass" + (i + 1);
});

Answer 2

次の方法で実行できます。

$('.news-story').each( function(idx,element){
  var cont = idx+1
  $(element).removeClass('news-story');
  $(element).addClass('customClass'+ cont );
});

Answer 3

var elems = document.getElementsByClassName('news-story');
for (var i=0; i<elems.length; i++) {
    elems[i].className = elems[i].className + ' customclass'+(i+1);
}

フィドル