Jquery菜单如何在单击外部元素时切换类

Question

我有这个菜单，但我无法弄清楚如何移除这个节目＆＃39;单击不同元素时单个元素上的类？ 当屏幕宽度超过739时，前2个功能用于悬停。这样就可以了。但响应部分如何点击不同的元素时如何关闭元素？

$(document).ready(function () {
    if ($(window).width() > 739) {
        $('#mainmenu li').hover(
            function () {
                //mostra sottomenu
                $('ul', this).stop(true, true).delay(50).slideDown(100);

            },
            function () {
                //nascondi sottomenu
                $('ul', this).stop(true, true).slideUp(200);
            });
    }
    else {
        $('#mainmenu li.drop1').click(
            function (event) {
                event.stopPropagation();
                //mostra sottomenu
                $('#myDropdown').toggleClass("show");
            }
        );
        $('#mainmenu li.drop2').click(
            function (event) {
                event.stopPropagation();
                //mostra sottomenu
                $('#myDropdown2').toggleClass("show");
            }
        );
        $('#mainmenu li.drop3').click(
            function (event) {
                event.stopPropagation();
                //mostra sottomenu
                $('#myDropdown3').toggleClass("show");
            }
        );
        $('#mainmenu li.drop4').click(
            function (event) {
                event.stopPropagation();
                //mostra sottomenu
                $('#myDropdown4').toggleClass("show");
            }
        );

    };
});

Answer 1

我用这段代码解决了，虽然现在我再次点击它时无法关闭元素^^

else {
    $(".drop").on("click", function (e) {
        e.stopPropagation();
        $("#myDropdown:visible", $(this).siblings()).slideUp("fast");
        $("#myDropdown:visible", $(this)).slideUp();
        $("#myDropdown", this).slideDown();


    });
    $(document).on("click", function(){
$(".drop #myDropdown").slideUp();
});