JQuery rebind after using html()

I am using JQuery .Html() to swap around the divs on my page using this code:

    $('#item1').html($('#item8').html());
    $('#item8').html('<p>sdsdsd<开发者_如何学C/p>');

I've found that this works great, however the JQuery methods stop working. So div #item1 will have a toggle for example, it will work fine until I use .html().

Is there any solution to rebind the JQuery to fix this?

Thanks!

Instead of getting the HTML of the elements and then having the browser reparse it into another element, you could just move nodes from one container to another:

var $item8 = $('#item8');
$('#item1').empty().append($item8.contents());
$item8.html('<p>sdsdsd</p>');

This will keep any current bindings on the already created elements, so there's no need to use live() or rebind those events.

live(), or rather, delegate() is still a decent alternative solution, however.

use .live and it will work

Use .delegate Docs See Jquery live() vs delegate() as to why you should use delegate over live.

$('itemParent').delegate('#item8', 'click', function(){});