JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/base/jquery-ui.css">
<html>
<head>
  <meta http-equiv="content-type" content="text/html;charset=UTF-8">
    <title>Testing jQuery UI Dialog</title>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.js"></script>
    <script src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>
</head>
<body id="ie_test_dialog" onload="">
  <a href="#" id="link_me">OPEN DIALOG</a>
  <div id="foo" style="display:none;"><input type="text" value="" /></div>
</body>
</html>

JavaScript

$("#foo").dialog({ 
    autoOpen: false,
    closeOnEscape: true,
    draggable: true,
    show: { "effect":"blind", "duration":5000 },
    hide: "scale",
    resizable: true
});

$("#link_me").bind("click",function(event){
    $("#foo").dialog("open");
    return false;
});