JSFiddle - React, Tailwind, and code Playground

HTML

<div class="modal">I'm the Modal Window!</div>

CSS

.modal {
    /* some styles to position the modal at the center of the page */
    position: fixed;
    top: 50%;
    left: 50%;
    width: 300px;
    line-height: 200px;
    height: 200px;
    margin-left: -150px;
    margin-top: -100px;
    background-color: #f1c40f;
    text-align: center;
   
    /* needed styles for the overlay */
    z-index: 10; /* keep on top of other elements on the page */
    outline: 9999px solid rgba(0,0,0,0.5);
}

JavaScript

$('html').click(function(){
    $('.modal').hide();
});
$('.modal').click(function(e){
    e.stopPropagation();
});