Clonar un div y cambiar los ID de él y todos sus elementos secundarios para que sea único

Question

Usando JQuery, es posible clonar una Div como esta y cambiar agregar un nuevo identificador a su ID y todas sus identidades de hijos.

Por ejemplo me gustaría ser capaz de clonar este:

<div id="current_users"> 
<table id="user_list"> 
<tr id="user-0"> 
<td id="first_name-0">Jane</td> 
<td id="last_name-0">Doe</td> 
</tr> 
<tr id="user-1"> 
<td id="first_name-1">John</td> 
<td id="last_name-1">Doe</td> 
</tr> 
</table> 
</div> 

Y tienen que parezca esto:

<div id="current_users_cloned"> 
<table id="user_list_cloned"> 
<tr id="user-0_cloned"> 
<td id="first_name-0_cloned">Jan</td> 
<td id="last_name-0_cloned">Doe</td> 
</tr> 
<tr id="user-1_cloned"> 
<td id="first_name-1_cloned">John</td> 
<td id="last_name-1_cloned">Doe</td> 
</tr> 
</table> 
</div> 

O debo replantear mi estructura y el uso de atributos rel y ¿Declaraciones de clase reutilizables?

Gracias,

Tegan Snyder

Answer 1

$("#current_users").clone(false).find("*[id]").andSelf().each(function() { $(this).attr("id", $(this).attr("id") + "_cloned"); }); 

y ver sus eventos si hay alguna unidos. Tendrás que arreglarlos si confían en los identificadores.

Answer 2

A menos que realmente necesite identificar de forma única cada uno de los DIV clonados mediante el código, reemplazaría sus ID con clases reutilizables. De lo contrario, la respuesta de David Morton parece que podría hacer el truco.