JQuery div to open / close hidden div

Question

I created some code that will hide / hide the hidden div when clicking div ("button"). I would also like the div to be hidden when it is clicked every time on the screen. These fragments seem to contradict each other.

$(document).ready(function () {

    $(document).on("click", "#help-icon", function () {
        console.log('hi');
        $("#help-menu").toggle();
    });

    $(document).mouseup(function (e) {
        var hlpcont = $("#help-menu");
        if (!hlpcont.is(e.target) && 
            hlpcont.has(e.target).length === 0) {
            hlpcont.hide();
        }
    });

});

jsfiddle: http://jsfiddle.net/CEs4c/1/

Answer 1

$(document).click(function (eventObj) {
    if (eventObj.target.id != "help-icon") {
        $("#help-menu").hide();
    } else {
        $("#help-menu").toggle();
    }
});

EDIT: If you want to click on the div that appears without hiding it again:

$(document).click(function(eventObj)
{
    if (eventObj.target.id == "help-icon") {
        $("#help-menu").toggle();
    } else if($(eventObj.target).hasClass("help-dropdown"))  {
        $("#help-menu").show();
    } else {
        $("#help-menu").hide();
    }


});

Answer 2

mouseup . mouseup . , mouseup , mouseup div, div .

mouseup click:

$(document).mouseup(function (e)
    {
        var hlpcont = $("#help-menu");
        var hlpIcon = $("#help-icon");
        if(hlpIcon.is(e.target)){
            hlpcont.toggle();
        }else
            {
              hlpcont.hide(); 
            }

    });