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 获取所有“新闻故事”分类元素并将“customclass1”添加到第一个元素，将“customclass2”添加到第二个元素，将“customclass3”添加到第三个元素，将“customclass4”添加到第四个元素。

任何人都可以帮我解决这个问题吗？

如果你这样做了，我保证一旦我的 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);
}

小提琴