jquery - colspane all columns of clone row -

i want merge columns (colspan) in new row created using clone() method of jquery . 1 more thing want new row have 1 column after colspan should have values of original row separated space .

i have tried clone , working me far consider cloning

$(document).ready(function(){  console.log($('table tbody tr').eq(0).html());  var newtr=$('table tbody tr').eq(0).clone();  console.log(newtr.html()); }); 

but no idea how colspan columns value of original row comma separated.

js fiddle link

edited

current html

<table>     <thead>         <tr>             <th>name</th>             <th>order</th>             <th>month</th>         </tr>     </thead>     <tbody>         <tr>             <td>rahul</td>             <td>#1</td>             <td>january</td>         </tr>         <tr>             <td>yunus</td>             <td>#2</td>             <td>april</td>         </tr>         <tr>             <td>nitin</td>             <td>#3</td>             <td>march</td>         </tr>     </tbody> </table> 

and after jquery code run want resulted html

<table>     <thead>         <tr>             <th>name</th>             <th>order</th>             <th>month</th>         </tr>     </thead>     <tbody>         <tr>             <td>rahul</td>             <td>#1</td>             <td>january</td>         </tr>         <tr>             <td>yunus</td>             <td>#2</td>             <td>april</td>         </tr>         <tr>             <td>nitin</td>             <td>#3</td>             <td>march</td>         </tr>         <tr>             <td colspan="3">rahul #1 january</td>         </tr>     </tbody> </table> 

$("table tbody tr:eq(0)").each(function() {     var $tr = $(this).clone(),         $td = $("td", $tr);      $td.filter(":gt(0)")        .remove()        .end()        .attr("colspan", $td.length)        .html($td.map(function() {            return this.innerhtml;        }).get().join(" "));      $tr.appendto($(this).closest("tbody")); }); 

demo: http://jsfiddle.net/uawnq/2/