How do I detect a click outside an element?



<div id="searchLink" style="border: 1px solid red; display: inline">Search Icon</div>

<div class="searchContainer" style="background: #ccc;display: none">
    <p>
        Search Key: <input>
    </p>
</div>

<script>
    jQuery(document).ready(function ($) {

        $(document).click(function(e) {
            if($(e.target).closest('#searchLink').length){
                $('.searchContainer').show();
            }else{
                $('.searchContainer').hide();
            }
        });
    });
</script>