JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://sachinchoolur.github.io/lightGallery/lightgallery/css/lightgallery.css">
<script src="http://sachinchoolur.github.io/lightGallery/lightgallery/js/lightgallery.js"></script>
<button id="iframe">Theme 3</button>

CSS

ul{
    list-style: none outside none;
    padding-left: 0;
}
li {
    display: block;
    float: left;
    height: 100px;
    margin-bottom: 6px;
    margin-right: 6px;
    width: 100px;
}
button{
    cursor:pointer;
}

JavaScript

function testing()
{
  console.log('running function');
}

var iframe = $('#iframe');

$('#iframe').click(function(e){	
  		e.preventDefault();
  		var _this = $(this);
			var $cl = $(this).lightGallery({
				download : false,
				counter: false,
				dynamic: true,
				escKey: false,
				dynamicEl: [{
					"src": 'http://sachinchoolur.github.io/lightGallery/demos/dynamic.html',
					'iframe' : true
				}]
			});	
  
  
			$cl.on('onCloseAfter.lg',function(event, index, fromTouch, fromThumb){
					testing();
          iframe.data('lightGallery').destroy(true);
          alert(3);
			});
  
  
});