Javascript 如何将类切换为当前单击类的子类

我试图在单击父类时为元素切换一个类，但由于它是一个菜单，其中大多数类都是相同的，所以我不想切换该类的所有子类，只切换当前单击的父类的子类

我的html结构：

<li>
    <a href="">Toepassingsgebied managementsysteem</a>
    <i class="mdi mdi-plus-box menuicon dropdown"></i>
    <ul class="dropdown-content menuliststyle">
        <li>Algemene bedrijfsgegevens</li>
        <li>Organogram</li>
        <li>Toepassingsgebied managementsysteem</li>
    </ul>
</li>

因此，我想在单击

.menuicon

时启动该函数，但只切换其当前子级的类

我也试过：

$( document ).ready(function() {
    $(".menuicon > dropdown-content").on("click", function() {
       $(this).toggleClass("dropdown-show");
       console.log('test');
    });
});

但我甚至没有在控制台中看到测试，所以正确的方法是什么

所以我想在.menuicon

在这种情况下，以.menuicon类为目标，。看看你的HTML，你想要下一个兄弟姐妹，。。在jquery中，这是下一步

例如

$（文档）.ready（函数（）{
$（“正文”）。单击“.menuicon”，
函数（）{
$（this.next（）.toggleClass（“下拉显示”）；
});
});
.menuicon{
颜色：红色；
光标：指针；
}
.下拉内容{
显示：无；
}
.dropdown-content.dropdown-show{
显示：块；
}


▼

阿尔杰梅内贝德里基芬斯酒店
器官图
通行证管理系统



▼

阿尔杰梅内贝德里基芬斯酒店
器官图
通行证管理系统

.menuicon>下拉内容

无法工作，因为该选择器将选择元素

下拉内容

作为

.menuicon

的直接子元素。

$( document ).ready(function() {
    $(".menuicon > dropdown-content").on("click", function() {
       $(this).toggleClass("dropdown-show");
       console.log('test');
    });
});