[fact]

Пишу плагин для работы с деревом сайта.

Объекты $('#elements') и $('#treeview') при загрузке забирают в себя списки #elements и #treeview, после нажатия кнопки cut, элемент li списка #treeview переносится в список '#elements', но объект $('#elements') не воспринимает перенесенный li своим(то есть по нему нельзя кликнуть и выделить).

Вопрос, как переинициализировать объект $('#elements'), чтобы он считал перенесенные li своими?

До нажатия кнопки:

<ul id="treeview">
<li><span>пункт 1</span></li>
<li><span>пункт 2</span>
<ul>
   <li><span>пункт 2.1</span></li>
   <li><span>пункт 2.2</span></li>
   <li><span>пункт 2.3</span></li>
</ul>
</li>
<li><span>пункт 3</span></li>
</ul>


<ul id="elements">
<li><span>пункт 1</span></li>
<li><span>пункт 2</span></li>
<li><span>пункт 3</span></li>
</ul>

После нажатия кнопки:

<ul id="treeview">
<li><span>пункт 1</span></li>
<li><span>пункт 2</span>
<ul>
   <li><span>пункт 2.1</span></li>
   <li><span>пункт 2.3</span></li>
</ul>
</li>
<li><span>пункт 3</span></li>
</ul>


<ul id="elements">
<li><span>пункт 1</span></li>
<li><span>пункт 2</span></li>
<li><span>пункт 3</span></li>
<li><span>пункт 2.2</span></li>
</ul>

(function($) {
	selectNode = function(obj) {
	var foo = $('li>span',obj);
	$(foo).bind('click', function()
	{
			if ($(this).hasClass('selected')) {
				$(this).removeClass('selected');
			}
			else {
				$(obj).find('span').removeClass('selected'),
				$(this).addClass('selected')
			}
	})};
		
	cut = function(){
		$("button[value='cut']").click(function(){
			var selectedSpan = $('#treeview').find('span.selected');
			var currentLi = selectedSpan.parent('li').removeClass();
			currentLi.remove().appendTo('#elements');
		});
	}
	
	$.fn.editTreeView = function() {
			
		cut();
		selectNode ($('#treeview'));
		selectNode ($('#elements'));
};})(jQuery);