مساعدة مع قائمة منسدلة

السلام عليكم

يوجد في موقع قائمة dropdown مستخدمة الكود التالي

<!--

jQuery(document).ready(function($) {
    loadtopmenu();
});
$("#boss-menu-category .boss_heading").click(function(){
    $('#boss-menu-category').toggleClass('opencate');
    loadtopmenu();
});
function loadtopmenu(){
    var menuheight = $('#boss-menu-category .box-content').outerHeight();
    var topcate = $('#boss-menu-category').offset().top;
    $('.boss-menu-cate .nav_title').each(function(index, element) {
        var liheight = $(this).outerHeight();
        var subheight = $(this).next('.nav_submenu').outerHeight();
        var topheight = $(this).offset().top - topcate -55;
        /*if((subheight < menuheight)&&(subheight < topheight)){
            var bottomh = topheight - subheight + liheight + 14;
            $(this).next('.nav_submenu').css('top', bottomh + 'px');
        }else{
            $(this).next('.nav_submenu').css('top', '-1px');
        }*/
    });
}   

//-->

أرغب في إضافة كود يجعل القائمة تختفي عند الضغط في أي مكان في الصفحة ضمن الوسم body والذي أعطيته ال id="content"

جربت إستخدام الكود التالي لكن لم يعمل بالشكل الصحيح حيث أدى لإغلاق القائمة في نفس لحظة فتحها

$('#content').click(function() {
    $('.opencate').removeClass('opencate');
});

هل من إقتراحات؟