title: Using jQuery in table to display single cell contents of selected row outside of table
body: <p>This is essentially my table inside of a loop:</p>
  
  <pre><code>&lt;table id="tblMyTable"&gt;
    &lt;tr&gt;
       &lt;td&gt;&lt;%= attachment.Name %&gt;&lt;/td&gt;
       &lt;td&gt;&lt;%= attachment.Description %&gt;&lt;/td&gt;
       &lt;td&gt;
          &lt;a id="clickPreview" href="#"&gt;Preview&lt;/a&gt;
          &lt;div id="divAttachmentContents" style="display:none;"&gt; &lt;%= attachment.ContentsAsHtml %&gt;
          &lt;/div&gt;
       &lt;/td&gt;
     &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>From this I get multiple rows with data.  I want to have a preview button on the end of the row, the last column, that will 'preview' the contents in a div further down the page.
  I assumed I should render out the content to a hidden cell to make it appear quickly.</p>
  
  <p>I need to know how to tell jQuery the row I'm on - and to fetch the text of the last cell.</p>
  
  <p>The gist of what I need is:</p>
  
  <pre><code>    $('#clickPreview').click(function () {
          var newContent = $('#divAttachmentContents').text();
          $('#divAttachmentPreview').html(newContent);
      });
  </code></pre>
  
  <p>But that only works on the first row.
  I may have to do something like</p>
  
  <pre><code>&lt;div id="&lt;%= "divAttachmentContents_" + attachment.Id %&gt;" style="display:none;"&gt; &lt;%= attachment.ContentsAsHtml %&gt; &lt;/div&gt;
  </code></pre>
  
  <p>But I'm not sure.  This may be similar to <a href="https://stackoverflow.com/questions/3185391/jquery-datatable-cell-from-a-row-click" title="jquery-datatable-cell-from-a-row-click">This question</a> Any assistance would be greatly appreciated!</p>