How can I find the new div id of an element moved with Jquery sortable?

I want to know the new position (div id) of an element I just moved

How can I do this ?

http://jqueryui.com/demos/sortable/#empty-lists

<script>
    $(function() {

        $("#sortable").sortable({
    update: function(event, ui) {
        a开发者_运维百科lert("New position: " + ui.item.index());
    }
});

        $( "ul.droptrue" ).sortable({
            connectWith: "ul"
        });

        $( "ul.dropfalse" ).sortable({
            connectWith: "ul",
            dropOnEmpty: false
        });

        $( "#sortable1, #sortable2, #sortable3" ).disableSelection();
    });
    </script>


<ul id="sortable1" class='droptrue'>
    <li class="ui-state-default">Can be dropped..</li>
    <li class="ui-state-default">..on an empty list</li>
    <li class="ui-state-default">Item 3</li>
    <li class="ui-state-default">Item 4</li>
    <li class="ui-state-default">Item 5</li>
</ul>

<ul id="sortable2" class='dropfalse'>
    <li class="ui-state-highlight">Cannot be dropped..</li>
    <li class="ui-state-highlight">..on an empty list</li>
    <li class="ui-state-highlight">Item 3</li>
    <li class="ui-state-highlight">Item 4</li>
    <li class="ui-state-highlight">Item 5</li>
</ul>

<ul id="sortable3" class='droptrue'>
</ul>

In you callback, you can use event.pageX and event.pageY to determine the offset with respect to the page.

Your code works perfectly (see this fiddle) once you call sortable() on an element that actually exists in the page:

$("#sortable2").sortable({
    update: function(event, ui) {
        alert("New position: " + ui.item.index());
    }
});