jquery - 将另一个不同的类附加到一组相似的类

Question

我想将不同的类附加到一组重复元素。

<div class="widget"></div>
<div class="widget"></div>
<div class="widget"></div>
<div class="widget"></div>

我想通过向它们附加不同的样式类来设置上述 div 元素的样式。

应该变成这样

<div class="widget fg-white"></div>
<div class="widget fg-black"></div>
<div class="widget fg-red"></div>
<div class="widget fg-green"></div>

我知道使用 jquery 描述的直接 CSS 编辑技术 here .但是在这里，我想附加已经具有我想要的样式的类。

Answer 1

您可以使用:

var colors = ["white", "black", "red", "green"];

$('.widget').each(function(i) {
  $(this).addClass("fg-"+colors[i % colors.length]);
});

Working Demo