title: jquery ui multiple dynamic dialogs
body: <p>So I have like a list of users on a page. each user name is clickable and it displays the user information in the dialog. Right now I'm using a static length for the list.
  I would like jquery to see how big the list of users is and apply the code to the list.</p>
  
  <p>Check out the code here:</p>
  
  <pre><code>$(function() {
      var options = {
              autoOpen: false,
              width: 'auto',
              modal: true
      };
      $([1, 2, 3, 4]).each(function() {
              var num = this;
              var dlg = $('#dialog-player-' + num).dialog(options);
              $('#player-link-' + num).click(function() {
                      dlg.dialog("open");
                      return false;
              });
      });
  </code></pre>
  
  <p>});</p>
  
  <p>I looked at this page of the documentation: <a href="http://docs.jquery.com/Core/each" rel="nofollow noreferrer">each</a>
  What I tried is to select all divs in container "div#parent". Like so:</p>
  
  <pre><code>$(function() {
      var options = {
              autoOpen: false,
              width: 'auto',
              modal: true
      };
      $("div#parent div").each(function() {
              var num = this;
              var dlg = $('#dialog-player-' + num).dialog(options);
              $('#player-link-' + num).click(function() {
                      dlg.dialog("open");
                      return false;
              });
      });
  </code></pre>
  
  <p>}); </p>
  
  <p>But that didn't work. Anybody know of any other way to do this ? </p>