Droppable не запускается в jQuery UI

HTML:

<ul id="tree">
    <li id="1">test1</li>
     <li id="2">test2</li>
     <li id="3">test3</li>
     <li id="4">test4</li>
</ul>

JQuery:

$("#tree li").draggable().droppable({
  element: '#tree',
  tolerance: 'around',
  aroundTop: '25%',
  aroundBottom: '25%',
  aroundLeft: 0,
  aroundRight: 0,
  drop: function(event,ui) {
    id = $(this).attr("id");
    alert(id);
  }
});

Но событие капли не стреляет. Я не понимаю. Невозможно найти ошибку.

Вот пример скрипта и скрипт ui.overState