JSFiddle - React, Tailwind, and code Playground

by Amin Kodaganur

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<div id="dialog" title="Basic dialog" style="display:none;">
  <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>

<button id="test">test</button>

<button id="close">close</button>

JavaScript

$(function() {
    $('#test').click(function(){
    	$( "#dialog" ).dialog();
    });
    
    $('#close').click(function(){
    		$('.ui-icon-closethick').trigger('click');
    });
    
  });