JSFiddle - React, Tailwind, and code Playground

HTML

<a href="#">Click Me first then Click the last one</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">popup</a>
<br />
<a href="#">click me</a>
<br />

CSS

.lightbox-container{
    border: solid red 1px;
    width: 100px;
    height: 40px;
    background: yellow;
    position: absolute;
    top: 0;
}

JavaScript

$('a').on('click', function(e){
  e.preventDefault();
  var lightBox = $('<div class="lightbox-container"> <p>click to remove</p>');
  lightBox.appendTo('body');
  $('.lightbox-container').on('click', function(e){
   $(this).remove();
  });
});