jQuery - Don't hide div if I click inside it
<p>I'm trying to keep the current div visible if I click inside it. I want to hide the div only if I click anywhere on the page but the current div.</p>

<p>I already tried <code>e.stopPropagation();</code> but that breaks other click handlers I have inside the function.</p>

<p><strong><a href="https://jsfiddle.net/2pr3xtxf/23/" rel="nofollow">jsFiddle</a></strong></p>

<pre><code>var filterContainer = $(".js-filter-container");
var pageDocument = $(document);

$(document).on('click', '.js-show-filter', function(e) {
    e.preventDefault();

    var currentFilter = $(this).next(filterContainer);
    currentFilter.toggle().css("z-index", 99);
    filterContainer.not(currentFilter).hide();

    pageDocument.click(function(){
        filterContainer.hide();
    });

    return false;
});
</code></pre>