将类添加到一组li'；在Jquery中，一次只有一个

我有一个ul的5个li和一个按钮。单击按钮，我想在第一个li中添加一个类，然后在第二个li中单击从第一个li中删除该类，并将其添加到第二个ect中。我知道我可以给每个李一个单独的id，但我知道一定有更好的方法，我可能希望它在某个时候也是动态的

提前谢谢。

你可以这样做

$('#yourButton').click(function(){
   var ul=$('#yourUlId');
   var next= $('li:not(.yourClass)',ul).first();
   next.addClass('yourClass');
   next.prev().removeClass('yourClass');
});

你可以这样做

$('#yourButton').click(function(){
   var ul=$('#yourUlId');
   var next= $('li:not(.yourClass)',ul).first();
   next.addClass('yourClass');
   next.prev().removeClass('yourClass');
});

---

您可能希望将选择器细化为比

li

更具体的内容，但这应该可以做到（放置在单击处理程序中）

---

您可能希望将选择器细化为比

li

更具体的内容，但这应该可以做到（放置在单击处理程序中）

---

使用以下代码。首先，选择根

元素（如果存在多个）。然后，用您的类名搜索列表元素，例如

className

。如果该类存在（

li.length

），请从当前列表中删除该类，然后将其添加到下一个列表中。否则，将该类添加到

的第一个列表元素中

$("#buttonID").click(function(){
    var ul = $("ul"); //Root <ul>, change it to the desired UL, eg #myUL
    var li = $("li.className", ul);
    if(li.length){
        li.removeClass("className").next().addClass("className");
    } else {
        $("li", ul).addClass("className");
    }
})

$（“#按钮”）。单击（函数（）{
var ul=$（“ul”）；//Root
，将其更改为所需的ul，例如#myUL
var li=$（“li.className”，ul）；
如果（li.长度）{
li.removeClass（“className”）.next（）.addClass（“className”）；
}否则{
$（“li”，ul）.addClass（“类名”）；
}
})

使用以下代码。首先，选择根

元素（如果存在多个）。然后，用您的类名搜索列表元素，例如

className

。如果该类存在（

li.length

），请从当前列表中删除该类，然后将其添加到下一个列表中。否则，将该类添加到

的第一个列表元素中

$("#buttonID").click(function(){
    var ul = $("ul"); //Root <ul>, change it to the desired UL, eg #myUL
    var li = $("li.className", ul);
    if(li.length){
        li.removeClass("className").next().addClass("className");
    } else {
        $("li", ul).addClass("className");
    }
})

$（“#按钮”）。单击（函数（）{
var ul=$（“ul”）；//Root
，将其更改为所需的ul，例如#myUL
var li=$（“li.className”，ul）；
如果（li.长度）{
li.removeClass（“className”）.next（）.addClass（“className”）；
}否则{
$（“li”，ul）.addClass（“类名”）；
}
})

这里有一个可行的解决方案：

谨此陈辞：

JS:

HTML:

---

这里有一个可行的解决方案：

谨此陈辞：

JS:

HTML:

---

您没有按照问题中所述删除该类。这也会全局查看所有

li

元素，而不是特定于列表。您没有按照问题中所述删除类。这还全局查看所有

li

元素，而不是特定于列表。嗨，这是所有li元素的添加类。哎呀。你当然是对的。if语句的第一个分支应该是

$（'li'）。first（）

。其他的一切都应该很好。嗨，这是所有李老师的课。哎呀。你当然是对的。if语句的第一个分支应该是

$（'li'）。first（）

。其他一切都应该可以正常工作。请您稍微解释一下代码，我对next（）方法的工作方式有问题。在您的代码中，您不需要以与我相同的方式声明

change

函数<代码>功能更改（）{可以。在jsFiddle中，你必须这样声明它们。谢谢，非常简单但非常有效。像jsFiddle这样的实时站点的链接是答案的一个很好的附件，但总是将相关代码放在答案本身中。外部站点可以移动、离开等等，这使得回答对其他有同样问题的人来说毫无用处。你能解释一下代码吗？我对next（）方法的工作原理有点问题。在你的代码中，你不需要像我一样声明

change

函数。

function change（）{

可以。在jsFiddle中，你必须这样声明它们。谢谢，非常简单但非常有效。像jsFiddle这样的实时站点的链接是答案的一个很好的附件，但总是将相关代码放在答案本身中。外部站点可以移动、离开等等，这使得回答对其他有同样问题的人来说毫无用处.

<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
</ul>
<button onclick="change()">Change</button>

.myclass {
     color: #f00;   
}