The <a> tag won't work after cloning

I tried to make use of the clone() command while duplicating a <li> but for some reason I can't get the links to work on the cloned copy. Could you check this out and tell me what I did wrong?

/*
---- Sample markup ----------------------------------------------
<ul>
   <li><input name="" type="text" /><a href="#" class="add">+ add more</a></li>
</ul>
*/

//JS starts here
$(document).ready(function(){
   $('a.add').click(function(){
      $(this).parent().clone().insertAfter($(this).parent());
   });
});


The duplicates display fine. the problem is when you click on the "+ add more" link on any of the duplicates nothing happens. It only seems to work on the original.

• Topic Participants

• enchance

• adamelevate