jQuery UI disappearing dialog

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/themes/blitzer/jquery-ui.css">
<a class="dia" href="#" id="Content of PHP code link 1">Link 1</a>
<a class="dia" href="#" id="link2">Link 2</a>

<div id='dialog'></div>

JavaScript

$('.dia').click(function() {
        var id = ($(this).attr('id'));
      $("#dialog").html(id);  
      $( "#dialog" ).dialog({modal: true, buttons: [{
                                                  text: "Ok",
                                                  click: function() { $(this).dialog("close"); }
                                                  }]  ,                                                 closeOnEscape: false ,                              draggable: true,                                       height: 200,
width:200,
resizable: true,
title: 'Alert ::',                                    zIndex: 9999    });
        // prevent the default action, e.g., following a link
        return false;
    });