Drag & Drop Jquery

Здравствуйте!
Есть js код:
[js]$(document).ready(function() {
$("#draggable li").draggable ({
helper: "clone",
connectToSortable: "#sortable",
});
$("#sortable").sortable ({
activate: function (event, ui) {
$(ui.helper).html("Текст");
}
});
});[/js]
HTML:

HTML:

1. <ul id="sortable">
2. <li class="itemColor1">Пункт 1</li>
3. <li class="itemColor1">Пункт 2</li>
4. <li class="itemColor1">Пункт 3</li>
5. <li class="itemColor1">Пункт 4</li>
6. <li class="itemColor1">Пункт 5</li>
7. </ul><br><br>
8. <ul id="draggable">
9. <li class="itemColor2">Пункт 1</li>
10. <li class="itemColor2">Пункт 2</li>
11. <li class="itemColor2">Пункт 3</li>
12. <li class="itemColor2">Пункт 4</li>
13. <li class="itemColor2">Пункт 5</li>
14. </ul>

При перемещение например "Пункт 1" из второго списка в первый - пункт заменяется на "Текст ". Однако, когда этот самый пункт "сбрасывается" над первым списком, он снова трансформируется обратно, то есть снова получает название "Пункт 1", а не "Текст". Каким образом сделать так, что бы при "сбрасывание", этот самый пункт сохранял за собой название "Текст"? Пробовал различные события, но видимо чего не до понял. Пожалуйста, объясните!