title: DIV content shows on page instead of JQuery Dialog
body: <p>I have the following DIV markup:</p>
  
  <pre><code>&lt;div id="dialog" title="Membership Renewal"&gt;
  Your membership is going to expire.
  &lt;/div&gt;
  </code></pre>
  
  <p>I have the following javascript to execute the JQuery:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  function showjQueryDialog() {
      $("#dialog").dialog("open");
      //alert("Time to renew Membership!");
  }
  
  $(document).ready(function() {
      $("#dialog").dialog({
          autoOpen: false,
          modal: true,
          buttons: { "Renew Membership": function() { $(this).dialog("close"); } }
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>I have an asp:Button  which is inside a control and the control is on a master page.  The first thing I notice is that when the page is loaded, the div is displayed and then disappears when the page is done loading.  When I click the button it executes the following:</p>
  
  <pre><code>if (timeSpan.Days &gt;= 30)
  {
  //Show JQuery Dialog Here
  ScriptManager.RegisterClientScriptBlock(this, typeof(Page), "showExpiration",    
  "showjQueryDialog()", true);
  }
  </code></pre>
  
  <p>When I click the button, instead of a dialog popping up, the content of the div just becomes visible.</p>