Jquery 如何将数组中的一个类按顺序应用于每个li？

html

<ul class="logoUl">
    <li class="orange"></li>
    <li class="blue"></li>
    <li class="green"></li>
    <li class="pink"></li>
</ul>

在ul中有4个li。logoUL制作了一个图像liek这个 有时徽标会获得背景色，从而将颜色重置为灰色

目前我的代码没有重置颜色

问题：

如何在每次添加一个类的同时迭代

li

，希望通过类获得原始配色方案？

您可以使用

if (selectedCategory == 'currentAll') {

    var strString = "orange,blue,green,pink";
    var strArray = strString.split(',');

    $.each(strArray, function (index, value) {
        $("ul.logoUl > li").eq(index).addClass(value)
    });
}

演示：

<ul class="logoUl">
    <li class="orange"></li>
    <li class="blue"></li>
    <li class="green"></li>
    <li class="pink"></li>
</ul>

无回路：

注 当您将

class

更改为每个

li

时，有时会给它们类似的

背景

，因此，当您想再次给它们原始配色方案时，最好先删除以前指定的颜色

class

，然后再次指定原始

class

，如下所示：

var strString = "orange,blue,green,pink",
    strArray = strString.split(',');

$("ul.logoUl > li")
    .removeClass() // first remove previous class
    .addClass(function (index) { // then add new class
        return strArray[index];
    });

---

这是制作阵列的最佳方法吗？或者说，拆分是制作字符串数组的最佳方法吗？是的，根据字符串中的内容，您必须

。拆分
才能将其拆分为数组。@Matthew Harwood不使用循环方法，您可以在第二种方法中完成这项工作，这些符号和逻辑我从中确实学到了很多。+1很好地提出了这个问题
var strString = "orange,blue,green,pink",
    strArray = strString.split(',');

$("ul.logoUl > li").addClass(function (index) {
    return strArray[index];
});

var strString = "orange,blue,green,pink",
    strArray = strString.split(',');

$("ul.logoUl > li")
    .removeClass() // first remove previous class
    .addClass(function (index) { // then add new class
        return strArray[index];
    });