在移动设备上单击外部菜单时，菜单不会关闭

Question

我制作了一个按钮单击时出现的菜单，然后在任何地方点击时关闭。它在桌面上运行得非常好，但它不能在Mobile上工作，似乎无法找出原因。非常欢迎你的帮助。

HTML

<div class="filter-menu-toggle">
    Sort <span class="menu-toggle-name">End Date</span><i class="icon-arrow_drop_down"></i>
</div>


<div id="campaign-sort-filter"> 

    <div class="filter-menu-dropdown menu-pos-2">
        <ul>
            <li class="filter-menu-item">
                <a href="#" class="filter-menu-link">End Date</a>
            </li>
            <li class="filter-menu-item">
                <a href="#" class="filter-menu-link">Start Date</a>
            </li>   
        </ul>                   
    </div>

</div>

的jQuery

var menuwashandled=false;

jQuery('#campaign-sort-filter').on('click', function(){
if (jQuery('#campaign-sort-filter .filter-menu-dropdown').css('display') == 'none')
    jQuery('#campaign-sort-filter .filter-menu-dropdown').fadeIn(100);
else
    jQuery('#campaign-sort-filter .filter-menu-dropdown').fadeOut(100);
menuwashandled = '#campaign-sort-filter';
});

/* catch global click event and hide all menues expect for the one that was handled if such exists */

jQuery('html').click(function() {
  if (menuwashandled != '#campaign-sort-filter')
     jQuery('#campaign-sort-filter .filter-menu-dropdown').fadeOut(100);
  menuwashandled = false;
});

有更好的方法可以做到更适合移动设备吗？或者只是更好一点？