Jquery 如何在运行时应用css类

我不熟悉jQuery。我想将css类应用于我的

元素，但它不起作用。有人能帮我吗

我的标记是：

<ul class='change'>
    <li>companyName</li>
    <ul id='uid'>
        <li onClick='callTest()'>subcompany</li>
        <li onClick='callTest()'>subcompany</li>
        <li onClick='callTest()'>subcompany</li>
    </ul>

  <ul id='uid'>
        <li onClick='callTest()'>subcompany2</li>
        <li onClick='callTest()'>subcompany2</li>
        <li onClick='callTest()'>subcompany2</li>
    </ul>
    </li>
</ul>

---

它工作正常，但第一次我选择了子公司它被应用了

选择了

类，现在我选择了子公司2也被应用了

选择了

类，但这次我想删除子公司类。如何执行此操作？

问题似乎是针对所有

li

元素，包括父元素，而不是仅针对

uid

$('#uid li').click(function () {
    console.log("call lil...'");
    $(this).addClass('selected').siblings().removeClass('selected');
})

---

演示：

它实际上工作正常

$('ul li').click(function(){
    console.log("call lil...'");
    $(this).addClass('selected').siblings().removeClass('selected');
});

以下是演示：

---

检查你的html文件。包括脚本或jquery在内一定有问题。

您的代码是正确的。由于您已在head/body中添加了此脚本，因此无法工作

因此，只需将它包装在

$（document）.ready（function（）…

$(document).ready(function(){
$('ul li').click(function(){
    console.log("call lil...'");
      $(this).addClass('selected').siblings().removeClass('selected');
    })
});

还可以尝试像这样使用

.on（）

事件处理程序

$(document).ready(function(){
$('ul li').on('click', function(){
    console.log("call lil...'");
      $(this).addClass('selected').siblings().removeClass('selected');
    })
});

---

删除

li

上的

onclick

，并在文档准备就绪时添加处理程序：

$(document).ready(function(){
  $('ul li').click(function () {
    console.log("call lil...'");
    $(this).addClass('selected').siblings().removeClass('selected');
    callTest();
  })
});

---

通过以下方式修改HTML：

<ul class='change'>
    <li>companyName</li>
    <ul id='uid'>
        <li>subcompany</li>
        <li>subcompany</li>
        <li>subcompany</li>
    </ul>
</ul>

$('#uid > li').each(function () {
    $(this).on("click", function() {
        console.log("call lil...'");
        $(this).addClass('selected').siblings().removeClass('selected');
    });
});

---

这里有一个HTML问题：

<ul class='change'>
    <li>companyName
        <ul id='uid'>
            <li onClick='callTest()'>subcompany</li>
            <li onClick='callTest()'>subcompany</li>
            <li onClick='callTest()'>subcompany</li>
        </ul>
    </li> <!-- I moved this one -->
</ul>

---

在che click处理程序中调用callTest（）。

li元素中不需要onclick属性。删除这些属性可以很好地工作，这里有错误吗？如果使用jQuery click处理程序，则不需要使用

onclick=“callTest（）”

$('#uid > li').each(function () {
    $(this).on("click", function() {
        console.log("call lil...'");
        $(this).addClass('selected').siblings().removeClass('selected');
    });
});

<ul class='change'>
    <li>companyName
        <ul id='uid'>
            <li onClick='callTest()'>subcompany</li>
            <li onClick='callTest()'>subcompany</li>
            <li onClick='callTest()'>subcompany</li>
        </ul>
    </li> <!-- I moved this one -->
</ul>

$('ul.change > li').click(function(){ //Only applies to the direct child of ul.change
    console.log("call lil...'");
      $(this).addClass('selected');
    })