垂直菜单不会在点击时显示我的子菜单

Question

我正在创建一个vertical menu来打开和关闭子菜单（使用js） 我使用WordPress菜单执行此操作，因此设置如下：

<div id="menu">
    <?php wp_nav_menu( array( 'theme_location' => 'webshop-menu') ); ?>
</div>
<script>
jQuery(document).ready(function($){
    $("#menu > div > ul > li > a").click(function (e) { // binding onclick
        if ($(this).parent().hasClass('selected')) {
            $("#menu .selected ul").slideUp(100); // hiding popups
            $("#menu .selected").removeClass("selected");
        } else {
            $("#menu .selected ul").slideUp(100); // hiding popups
            $("#menu .selected").removeClass("selected");

            if ($(this).next(".sub-menu").length) {
                $(this).parent().addClass("selected"); // display popup
                $(this).next(".sub-menu").children().slideDown(200);
            }
        }
        e.stopPropagation();
    }); 

    $("html").click(function () { // binding onclick to body
        $("#menu .selected ul").slideUp(100); // hiding popups
        $("#menu .selected").removeClass("selected");
    }); 

});
</script>

这是CSS：

#menu {
    float: right;
    position: relative;
    top: 25px;
}
#menu > div > ul > li {
    display: inline-block;
    text-align: center;
    padding: 0 1em;
}
#menu > div > ul > li.menu-item-has-children a:after {
    content: " \f107";
    font-family: FontAwesome;
}
#menu li a {
    color: #000;
    text-decoration: none;
    font-weight: bold;
}
#menu li a:hover {
    color: #000;
}
#menu > div > ul > li > ul {
    display: none;
}
#menu > div > ul > li > ul.selected {
    display: inline;
}

我确实看到菜单，但我找不到任何错误或警告 我错过了什么？

我遇到了以下想法：

  

是否可以因为链接附有页面？如果页面没有页面，那么它可能会起作用，因为没有目的地....！

微米。