JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://s4ty-testarea.s4.ohost.de/jQuery-board/css/jquery-ui-1.8.20.custom.css">
<div id="dialog"><img src="http://s4ty-testarea.s4.ohost.de/jQuery-board/images/001.jpg"/></div>
<input id="btn_dialog" type="button" value="Open Dialog"/>
<div id="dialog">dialog content</div>

JavaScript

$(function(){
    var dialog = $('#dialog');
    
    dialog
        .dialog({
            autoOpen: false,
            modal: true,
            title: 'Test Dialog',
            width: '530px',   
            buttons: {
                'Submit': function() {
                    alert('Success!');
                    $(this).dialog('close');            
                },              
                'Cancel': function() {
                    $(this).dialog('close');
                }                            
            }
        })
        .parent()
        .find('.ui-dialog-buttonset')
        .css({
            float: 'left',
            width: '500px'
        })
        .find('button:contains("Cancel")')
        .css({
            float: 'right',
            color: 'red'
        })
        .end()
        
        .find('button:contains("Submit")')
        .css({
            color: 'green'
        })        
    $('#btn_dialog')
        .button()
        .click(function (){
            dialog.dialog('open');
        })
})