Cacher is the code snippet organizer for pro developers

<a data-open="custom-id"></a>
<div id="custom-id" style="display: none"></div>

<script>
  $('[data-open]').on('click', function (event) {
        function eventDocument(id, evt) {
            if ($(evt.target).closest('#' + id).length == 0 && $(evt.target).closest('[data-open]').attr('data-open') != id) {
                $('#' + id).hide();
                document.removeEventListener('click', x)
            }
        }

        var id = $(this).attr('data-open');
        var x = eventDocument.bind(null, id);
        document.addEventListener('click', x);
        $('#' + id).fadeIn();

  });
<script>