Javascript 在父列表上悬停显示嵌套列表

我有一个菜单结构，其中子菜单以嵌套列表的形式出现，如下所示

<nav>
<ul>
<li class="itm">A
    <ul>
        <li>One</li>
        <li>Two
            <ul>
                <li>Menu Item</li>
                <li> Menu Item </li>
                <li> Menu Item </li>
            </ul>
        </li>
        <li> Three </li>
        <li> Four </li>
    </ul>
</li>

<li class="icon"><span class="img"></span></li>
<li class="itm">B</li>
<li class="itm">C</li>
</ul>
</nav>

---

但当鼠标悬停时，它会在JS控制台中显示此错误：

uncaughtreferenceerror:ul未定义

您的选择器正在组合

此

，它是一个文本，选择器中的字符串应该是什么（

>ul

）

ul

被视为变量，而

ul

变量不存在

试试这个：

---

有什么特别的原因不使用CSS而不是jQuery吗？

$('nav ul li').hover(function () {
    console.log(this);
    $(this > ul).fadeIn();
}, function () {
    $(this > ul).fadeOut();
});

$(this).children('ul').fadeIn();