Drag and Drop jquery ui

Drag from one ul to another ul and initiaze again dragdrop event

HTML

<ul id="list1" class="lists"><li>acss</li></ul>
<ul id="list2" class="lists"></ul>

CSS

.lists {
    height: 200px;
    width: 300px;
    border: 1px solid #000000;
}

JavaScript

//$( "#list1 > li" ).draggable();
    $("#list1 > li").draggable({
        cancel: "button", // these elements won't initiate dragging
        revert: "invalid", // when not dropped, the item will revert back to its initial position
        containment: "document",
        helper: "clone",
        cursor: "move"
    });