title: jquery ui dialog open multiple dialog boxes using the same class on the button and the content div
body: <p>i want to open multiple dialog boxes by using the same class on both the button and the content div. The below works but only for the first time. </p>
  
  <pre><code>jQuery('.helpDialog').hide();
  
  jQuery('.helpButton').click(function() {  
      jQuery(this).next('.helpDialog').dialog({  
      autoOpen: true,  
      title: 'Help',  
      width: 500,  
      height: 300,  
      position: [180,10],  
      draggable: true,    
      resizable: false,  
      modal: false  
      });  
  return false;  
  });  
  </code></pre>
  
  <p>we know the reason for this 
  <a href="http://blog.nemikor.com/2009/04/08/basic-usage-of-the-jquery-ui-dialog/">http://blog.nemikor.com/2009/04/08/basic-usage-of-the-jquery-ui-dialog/</a>
  "the second call is ignored because the dialog has already been instantiated on that element."  </p>
  
  <p>But when i fix that problem by trying the code below, the dialog box no longer opens.
  Can anyone help?
  Thanks in advance </p>
  
  <pre><code>jQuery('.helpDialog').hide();
  
  jQuery(function() {  
      jQuery('.helpDialog').dialog({  
          autoOpen: false,  
          modal: true,  
          title: 'Info',  
          width: 600,  
          height: 400,  
          position: [200,0],  
          draggable: false  
      });  
  });  
  
  jQuery('.helpButton').click(function() {  
      jQuery(this).next('.helpDialog').dialog('open');  
      return false;  
  });  
  </code></pre>