Как применить jQuery Sortable к тегу li и li child?

Question

У меня есть один стол ul, который необходимо сортировать. Я могу выполнить drag-drop/sortable с помощью li, но я хочу выполнить его, используя класс .drag, который имеет тег a.

Ниже приведен пример рабочего HTML.

<ul id="sortable" class="ui-sortable"> 
    <li class="li" id="1"> 
     <a href="javascript:;" class="button close"></a> 
     <a href="javascript:;" class="button drag"></a> 
     <a href="javascript:;">Item 1</a> 
    </li> 
    <li class="li" id="2"> 
     <a href="javascript:;" class="button close"></a> 
     <a href="javascript:;" class="button drag"></a> 
     <a href="javascript:;">Item 2</a> 
    </li> 
    <li class="li" id="3"> 
     <a href="javascript:;" class="button close"></a> 
     <a href="javascript:;" class="button drag"></a> 
     <a href="javascript:;">Item 3</a> 
    </li> 
</ul> 

Как я могу выполнить сортируется на .drag класса a тега?

Я пробовал с items: ' > a' и handle: '.drag', но не повезло.

Если это возможно, то оно должно выглядеть так же, как и для знака li.

Заранее благодарим за любую помощь.

EDIT:

Я могу перетащить с помощью Ли, но не с помощью тега.

Answer 1

Это похоже на работу:

// Sort the parents 
$(".ui-sortable").sortable({ 
    handle: ".drag", 
    cursor: "move", 
}); 

// Sort the children 
$(".lines").sortable({ 
    containment: ".container", 
    items: "> .item", 
    connectWith: '.lines' 
}); 

Я изменил только <Li> элементы класса (только потому, что мне не нравятся занятия, названные в честь элементов).