JSFiddle - React, Tailwind, and code Playground

HTML

<div id="dialog">My dialog</div>
<a href="#" id="open" style="visibility:visible">Open dialog</a>

JavaScript

$('#open').click(function() {
    $('#dialog').dialog('open');
    $(".ui-dialog-titlebar").css('visibility','hidden');
    $(".ui-dialog-titlebar-close").css('visibility','visible');
//$(".ui-dialog-titlebar : not(#close)").hide();
});



jQuery(document).ready(function() {
    jQuery("#dialog").dialog({
        autoOpen: false,
        modal: true,
        open: function(){
            jQuery('.ui-widget-overlay').bind('click',function(){
                jQuery('#dialog').dialog('close');
            })
        }
    });
});