click show hide event prevent default

by ian_smithz

HTML

<a class="icon hide-text" id="btnNoti5" href="#">Notification</a>

<div id="divNotifi"></div>

CSS

#divNotifi {height: 100px; width: 100px; position:absolute; top: 100px; left: 100px; background: red; display:none}

JavaScript

$(document).on('click', function(e) {
    var elem = $(e.target).closest('#btnNoti5'),
        box  = $(e.target).closest('#divNotifi');
    
    if ( elem.length ) {
        e.preventDefault();
        $('#divNotifi').toggle();
    }else if (!box.length){
        $('#divNotifi').hide();
    }
});