JSFiddle - React, Tailwind, and code Playground

by sebababi

HTML

<img src="http://icons.iconarchive.com/icons/dryicons/simplistica/128/delete-icon.png" onClick="jAlert('Confirm deletion!', 'Do you really want to delete this package?');">
    
    <a href="#"  onClick="jAlert('Confirm deletion!', 'Do you really want to delete this package?');">hola</a>

JavaScript

// SOLUTION: NO WRAP IN <HEAD>
$(window).load(function(){
// WORKS createDialog('Confirm deletion!', 'Do you really want to delete this package');
});//]]>  

// WORKS createDialog('Confirm deletion!', 'Do you really want to delete this packag');

function jAlert(title, text) {
    // alert(title);
    return $("<div class='dialog' title='" + title + "'><p>" + text + "</p></div>")
        .dialog({
        resizable: false,
        height: 240,
        modal: true,
        buttons: {
            "Confirm": function () {
                $(this).dialog("close");
            },
            Cancel: function () {
                $(this).dialog("close");
            }
        }
    });
}