title: Simple pop up in jQuery for multiple table rows?
body: <p>I would like to put a simple pop up in my table to display additional details regarding each row. I just want to ask for ideas on how to show the pop up in every row. Currently the pop up is only shown for the first one.</p>
  
  <p>Here's my code:</p>
  
  <pre><code>@foreach (var name in Model){
  &lt;table&gt;
          &lt;tr&gt;
                   &lt;td&gt;Name&lt;/td&gt;
                  &lt;td&gt;  &lt;button id="@name.id"&gt;Show&lt;/button&gt;&lt;/td&gt;
          &lt;/tr&gt;
  &lt;/table&gt;
  }
  </code></pre>
  
  <p>Script:</p>
  
  <pre><code> &lt;script type="text/javascript"&gt;
  $(function() {
      $('#').click(function() { //what should I put in the #? considering that it would have different id's?
          $("#popupdiv").dialog({
              title: "jQuery Popup from Server Side",
              width: 430,
              height: 250,
              modal: true,
              buttons: {
                  Close: function() {
                      $(this).dialog('close');
                  }
              }
          });
          return false;
      });
  })
  </code></pre>
  
  <p></p>
  
  <p>View Pop:</p>
  
  <pre><code>&lt;div id="popupdiv" title="Basic modal dialog" style="display: none"&gt;
                  &lt;b&gt; Welcome &lt;/b&gt;
  &lt;/div&gt;
  </code></pre>