javascript函数没有'；我跑不完

我设置了以下JQuery/JS来打开/关闭菜单：

$('button.leftNav-dropDownButton').toggle(function () {
            $(this).addClass('dropDownActive');
            ...do stuff
        },
        function () {
            alert("Button has been clicked");
            $(this).removeClass('dropDownActive');
            ...do other stuff
        }
    );

当添加dropDownActive类时，该函数工作正常，它告诉CSS显示我的菜单，但当我再次单击按钮时，会弹出警报，因此我知道该函数正在被调用，但除非单击按钮的最外侧，否则不会消失。以下是按钮处于活动状态时的外观：

<button class="leftNav-dropDownButton hide-for-print dropDownActive">
    <span class="icon-reorder "></span>      //little menu icon
    <span class="icon-folder-arrow"></span> //arrow under button that points
                                            //from menu to button
</button>

//小菜单图标
//按钮下的箭头指向
//从菜单到按钮

以下是不活动时的外观：

<button class="leftNav-dropDownButton hide-for-print">
    <span class="icon-reorder "></span>
</button>

---

我尝试删除图标文件夹箭头，但没有效果。

将两个函数作为单独的参数传递给.toggle（），这似乎很奇怪。请参阅：我最初的想法是遵循.toggle（）的api并将1函数作为参数传递，在该函数内部使用if检查下拉列表是否打开或关闭。然后分支将关闭下拉列表（如果它打开），反之亦然{页边距：-999px；z索引：1000；顶部：40px；最大高度：85%；左侧：3px；高度：自动！重要；位置：相对；-moz方框阴影：0px 2px 20px 111；-webkit方框阴影：0px 2px 20px 111；方框阴影：0px 2px 20px 111；边框半径：0px！重要；}{display:none；}#sidenav.no sidenav{display:none；}将代码粘贴到JSFIDLE上