Jquery 仅为单个div单击锚点时切换类

我正在使用jquery切换页面中名为“active”的类，以显示我的div

这是我的HTML：

  <td>
    <nav id="dropdown">
        <ul>
            <li class="drop">
                <a href="#">More <i class="fa fa-chevron-down"></i></a>

                <div class="dropdownContain"><!-- active -->
                    <div class="triangle"></div>
                      <ul>
                        <li>Plan</li>
                        <li>Account Settings</li>
                        <li>Switch Account</li>
                        <li>Sign Out</li>
                      </ul>
                  </div>                                                            
             </li>
        </ul>
   </nav>
 </td>

计划
帐户设置
转换帐户
注销

以及切换类jQuery

<script type="text/javascript">
    $( document ).ready(function() {
        $(".drop a").click(function(){
            $( "div.dropdownContain" ).toggleClass( "active" );
            e.preventDefault();
        });
    });
</script>

$（文档）.ready（函数（）{
$（“.drop a”）。单击（函数（）{
$（“div.dropdownContain”）.toggleClass（“活动”）；
e、 预防默认值（）；
});
});

jQuery确实像预期的那样工作，但是如果我的页面上有2+行，当我单击页面上的任何锚定时，它会将“active”添加到页面上每个名为“dropdownContain”的div中

如何仅将“active”添加到单击锚定的相应div中？我可能有100多行需要这段代码，因此我不能为每个元素都有唯一的类或id

谢谢你的时间

您可以使用如下方法

$(".drop a").click(function(){
    $(this).next("div.dropdownContain").toggleClass( "active" );
    e.preventDefault();
});

您可以使用如下方法

$(".drop a").click(function(){
    $(this).next("div.dropdownContain").toggleClass( "active" );
    e.preventDefault();
});

---

您需要使用

此

来专门指代您正在单击的链接：

$(".drop a").click(function(){
    $(this).next("div.dropdownContain").toggleClass( "active" );
    e.preventDefault();
});

$（“.drop a”）。单击（函数（）{
$（this）.next（“div.dropdownContain”）.toggleClass（“active”）；
e、 预防默认值（）；
});
.active{
颜色：红色；
}




计划
帐户设置
转换帐户
注销






计划
帐户设置
转换帐户
注销



您需要使用
此
来专门指代您正在单击的链接：

$(".drop a").click(function(){
    $(this).next("div.dropdownContain").toggleClass( "active" );
    e.preventDefault();
});


$（“.drop a”）。单击（函数（）{
$（this）.next（“div.dropdownContain”）.toggleClass（“active”）；
e、 预防默认值（）；
});
.active{
颜色：红色；
}




计划
帐户设置
转换帐户
注销






计划
帐户设置
转换帐户
注销



感谢您的快速回复！当我使用它时，第一行按照我最初的意图工作，但是第二行不显示或隐藏div。不用担心，我认为这是多次使用CSS id的问题。谢谢谢谢你的快速回复！当我使用它时，第一行按照我最初的意图工作，但是第二行不显示或隐藏div。不用担心，我认为这是多次使用CSS id的问题。谢谢