You'll want to change the click function:
$('.white').click(function(event) {
$(".black ").slideToggle(150);
event.stopPropagation();
});
And add these two functions:
$(".black").click(function(event) {
event.stopPropagation();
});
$("html").click(function() {
$(".black").slideToggle(150);
});
This will make it so that if you click anywhere on the page, the html
's click handler will try to close the div
. However, if you are clicking on the div
or the "click me" link, event.stopPropagation()
will prevent the event from reaching the html
's click handler.
Here is a demo