JSFiddle - React, Tailwind, and code Playground

HTML

<a class="show_alerts" href="#">Show alerts</a>

<div id="popup">This is the popup content</div>

CSS

#popup {
    padding: 5px;
    border: 1px solid grey;
    display: none;
}
#popup.opened {
    display: block;
}

JavaScript

$('.show_alerts').click(function () {
    $('#popup').toggleClass('opened');
});
$(document).click(function (e) {
    if (!$(e.target).parents().andSelf().is('.show_alerts')) {
        $("#popup").removeClass("opened");
    }
});
$("#popup").click(function (e) {
    e.stopPropagation();
});