error on overlay remove

When destroying a modal dialog that was never shown, an error occrus when trying to remove a null overlay

by JMGrange

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/overcast/jquery-ui.css">
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.min.js"></script>
<div id="dialog" title="Basic dialog">
	<p>This is an animated dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>

<button id="opener">Open Dialog</button>
<button id="closer">Destroy Dialog</button>
<button id="create">Create Dialog</button>

<div class="demo-description">
<p>Dialogs may be animated by specifying an effect for the show and/or hide properties.  You must include the individual effects file for any effects you would like to use.</p>
</div>

JavaScript

$(function() {
		$( "#dialog" ).dialog({
			autoOpen: false,
		modal: true,
			show: {
				effect: "blind",
				duration: 1000
			},
			hide: {
				effect: "explode",
				duration: 1000
			}
		});

		$( "#opener" ).click(function() {
			$( "#dialog" ).dialog( "open" );
		});
		$( "#closer" ).click(function() {
			$( "#dialog" ).dialog( "destroy" );
		});
		$( "#create" ).click(function() {
			$( "#dialog" ).dialog({
				autoOpen: false,
				modal: true,
				show: {
					effect: "blind",
					duration: 1000
				},
				hide: {
					effect: "explode",
					duration: 1000
				}
			});
		});
	});