Want jquery to replace same <li> and all element insie ul

Question

I want jquery to include <li> and all other tags inside <ul class="visib-1"></ul> to <ul class="visib-2"></ul> without writing li ,a href="" tags again. Is there have any solution?Is it possible to capture all elements from one UL and transfer to other UL?

From:

<ul class="visib-1">

    <li><a href="#">Home</a></li>

    <li><a href="#">Properties</a></li>

    <li><a href="#">Blog</a></li>

    <li><a href="#">Start Now</a></li>
</ul>

To:

<ul visib-1>
   ?
</ul>

Answer 1

If all you want is to move from one <ul> to another:

$('#first-ul-id li').appendTo('#second-ul-id');

If you want to copy use clone()

$('#first-ul-id li').clone().appendTo('#second-ul-id');

Answer 2

Here is the solution. Check the code below: This code will also copy the event handlers attached.

 var cloneOfOld = $('[data-status="old"]').clone(true); cloneOfOld.attr('data-status','new'); var newUl = $('[data-status="new"]'); newUl.replaceWith(cloneOfOld); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <ul data-status="old"><li><a href="#">Home</a></li> <li><a href="#">Properties</a></li> <li><a href="#">Blog</a></li> <li><a href="#">Start Now</a></li> </ul> <ul data-status="new"> </ul>