JSFiddle - React, Tailwind, and code Playground

HTML

<div align="center" id="popupwindow"><div id="popupcontent"><a onclick="return false" href="/" class="close">Close</a></div></div>
<a onclick="return false" href="/" class="open">INFO<span>content content content</span></a>
<a onclick="return false" href="/" class="open">INFO2<span>more content</span></a>
<a onclick="return false" href="/" class="open">TEST<span>You get the point</span></a>

CSS

#popupwindow{
    position:fixed;
    height:100%;
    width:100%;
    z-index:2;
    background-color:rgba(0,0,0,.7);
    display:none;
}
#popupcontent{
    width:150px;
    margin-top:100px;
    background-color:#666;
    border-radius:5px;
    border:1px #000 solid;
    box-shadow:0px 0px 5px 1px rgba(0,0,0,.7);
}
.open span{
    display:none;
}

JavaScript

var $content = $('#popupcontent');
var $window = $('#popupwindow');
$('.open').click(function(){
    //alert('runnning');
    var a = $(this).contents('span');
    $content.append(a);
    $window.fadeIn(300);
});
$('.close').click(function(){
    //alert('running');
    var a = $content.contents('span');
    $window.fadeOut(300);
    $('#popupcontent span').remove();
});