JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"></script>
<link type="text/css" rel="stylesheet"  href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/themes/dot-luv/jquery-ui.css"/>
</head>
<body>
<script type="text/javascript">
    $(function () {
        $("input[type=submit]").button();       
    });
        var currentForm;
        $(function () {
            $("#dialog-confirm").dialog({
            show: "drop",
            hide: "fade",
                resizable: false,
                height: 220,
                width: 400,
                modal: true,
                autoOpen: false,
                buttons: {
                    'Yes': function () {
                        $(this).dialog('close');
                        currentForm.submit();
                    },
                    'Cancel': function () {
                        $(this).dialog('close');
                    }
                }
            });
            $(".confirm").click(function () {
                currentForm = $(this).closest('form');
                $("#dialog-confirm").dialog('open');
                return false;
            });
        });

</script>
<div id="dialog-confirm" title="Confirm dialog">
    Are you sure you want to delete this foobar ?
</div>

<form action="#" method="post" class="fr">
<input type="submit" class="confirm" value="Delete">
</form>
</body>
</html>