JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/themes/vader/jquery-ui.css">
<div id="dialog-confirm" title="Empty the recycle bin?">
  <span class="ui-icon ui-icon-alert"></span>These items will be permanently deleted and cannot be recovered. Are you sure?
</div>
<button id="showbox">Show Confirm Box</button>

JavaScript

$("#showbox").button().click(function() {
    $("#dialog-confirm").dialog("open");
});

$("#dialog-confirm").dialog({
    autoOpen: false,
    resizable: false,
    height: 250,
    modal: true,
    buttons: {
        "Delete all items": function() {
            //write the confirm true code here
            $(this).dialog("close");
        },
        Cancel: function() {
            //write the confirm false code here
            $(this).dialog("close");
        }
    }
});