JSFiddle - React, Tailwind, and code Playground

HTML

<!doctype html>
<head id="Head1" runat="server">
	<title>IE9Test</title>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"></script>
	<link rel="Stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
</head>
<body>
	<form id="form1" runat="server">		
		<div>
			<input id="TextBox1" type="text" />
			<br />
			<a id="Show" href="#">Show Dialog</a>
		</div>
	</form>
</body>

JavaScript

function ShowButton_Click(e) {
    var dialog = $('<div id="jqueryuidialog" ><iframe width="100%" height="100%" frameborder="0"></iframe></div>').hide();
    var frame = dialog.children("iframe");
    frame.attr("src", "http://jsfiddle.net/3BPWR/show/");
    dialog.dialog({ modal: true, autoOpen: false, title: "", width: 600, height: 600 });
    dialog.dialog('open');
    dialog.bind('dialogclose', function(){
        //frame.attr('src', 'about:blank'); //uncomment this line to fix input bug
        jQuery(this).dialog('destroy').remove(); // this line causes error, without it we have no error but we collect dialog iframes in DOM
    });
    
    e.stopPropagation();
}

jQuery(document).ready(new function() {
    jQuery("#Show").click(ShowButton_Click);
});