JSFiddle - React, Tailwind, and code Playground

HTML

<a href="" id="clickMe">Click Me</a>

<div id="foo2" class="foo"></div>

CSS

.foo{border:1px solid red; display:none;height:100px;
}

JavaScript

$('#clickMe').click(function(e) {
    $('#foo2').show();
    e.preventDefault();
});


$("#clickMe, #foo2").mouseup(function(){return false;});

$(document).mouseup(function(e){//removes menu when clicked on any other part of page
    if($("#foo2:visible").length > 0  ){
        $('#foo2').hide();
    }
});