title: copying image from one table row to another table using jquery
body: <p>I am copying content from one table to another as follows;</p>
  
  <pre><code>var ntr='',//to store html for new table row
  rows=[],//to collect new rows
  $tbl=$("#table_rolecart tbody"),//original table
  l=$("tr", $tbl).length;
  var row;
  for(int i=0;i=0;i&lt;l;){
          row=$("tr:eq("+i+")", $tbl);
    ntr= '&lt;tr&gt;&lt;td&gt;'
    +$("td:nth-child(2)",row).text()+'&lt;input type=hidden name="access_id" value='+accessid+'&gt;&lt;/td&gt;&lt;td&gt;'    //add item name
    +$("td:nth-child(3)",row).text()+'&lt;/td&gt;&lt;td&gt;'  //add description
    //want to add the third column which is an image with img tag
    + '&lt;/td&gt;&lt;/tr&gt;'
  </code></pre>
  
  <p>I am currently doing like + row.find("img.role-action") where I want to add the image column but the table shows the [Object] instead of the image. How do I copy the image to the new table?</p>
  
  <p>content of original table is as follows</p>
  
  <pre><code>&lt;table class="table sortable" id="table_rolecart"&gt;
      &lt;tbody&gt;
                &lt;tr class="odd"&gt;
                    &lt;td&gt;&lt;a href="#"&gt;&lt;img src="/gra/images/icons/fugue/cross-circle.png" class="move-row" alt="Remove"&gt;&lt;/a&gt;&lt;/td&gt;
                    &lt;td&gt;agile_unix_role&lt;input type="hidden" value="1101" name="role_id"&gt;&lt;/td&gt;
                    &lt;td&gt;this agile unix role&lt;/td&gt;
                    &lt;td&gt;&lt;img alt="add" src="/gra/images/icons/fugue/plus-circle.png" id="role_action" class="role_action"&gt;&lt;/td&gt;
               &lt;/tr&gt;
               &lt;tr class="slider"&gt;
                    &lt;td colspan="4"&gt;&lt;div class="sliding"&gt;Business Justification:&lt;input type="text" name="ar_businessjust"&gt;&lt;/div&gt;&lt;/td&gt;
               &lt;/tr&gt;
               &lt;tr class="slider"&gt;
                    &lt;td colspan="2"&gt;&lt;div class="sliding"&gt;Start Date: &lt;input type="text" id="ar_startdate" value=""&gt;&lt;/div&gt;&lt;/td&gt; 
                    &lt;td colspan="2"&gt;&lt;div class="sliding"&gt;End Date: &lt;input type="text" id="ar_enddate" value=""&gt;&lt;/div&gt;&lt;/td&gt;
               &lt;/tr&gt;
               &lt;tr style="height:8px"&gt;
               &lt;/tr&gt;
       &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>I want all the rows with all columns except the last row combined into one single row in the target table into seperate columns. I have acheived this , only thing remaining is the image in the first row's 4th column which I need to copy as the last column into target table</p>