How to close menu by click in other place on website jquery

Question

Hi guys how can I close menu by jquery by click on other place.

<div class="noticemenu">
    <label for="menu-toggle3"></label>
    <input type="checkbox" id="menu-toggle3"/>
    <ul id="menu">
        <li class="option">
            <a href="#" >First link</a>
        </li>
        <li class="option">
            <a href="#">Second link</a>
        </li>
        <li class="option">
            <a href="#">Third link</a>
        </li>
    </ul>
</div>

For example I could open menu after click on icon and could close the menu if clicked on same icon. I want to close menu when I click on free place on website. But I don't know how to do this in jQuery on above example.

Answer 1

Had the exact same problem, easy solution

$(document).mouseup(function (e)
{
    var container = $(".noticemenu");

    if (!container.is(e.target) // if the target of the click isn't the container...
        && container.has(e.target).length === 0) // ... nor a descendant of the container
    {
        container.hide();
    }
});