jQueryUI Dialog Test Demo

HTML

<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<button id="btn1">ダイアログ表示</button>

JavaScript

$("#btn1").click(function(){
	// ダイアログ用のボタン（配列）
	var buttons = [
		{
			text: "OK",
			click: function () { alert("OK!!"); }
		},
		{
			text: "閉じる",
			click: function () { $(this).dialog('close'); }
		}
	];
	// ダイアログを表示
	showDialog("たいとる", "めっせーじ", buttons);
});

//------------------------------
// ダイアログ表示
//------------------------------
function showDialog(title,message, buttons) 
{
	var html_dialog = '<div>' + message + '</div>';
	$(html_dialog).dialog({
		buttons: buttons,
		close:   function() { $(this).remove(); }
	});
}
// closeイベントで、ダイアログを破棄するようにしています。