How to append the id of li elements in the jQuery UI selectable multiples

Question

Okay, so I'm trying to integrate the jQuery UI plugin selectable (grid), and I like how it posts the selected indexes back. Here is what I would like to do:

$(function() {
    $( "#selectable" ).selectable({
        stop: function() {
            var result = $( "#select-result" ).empty();
            $( ".ui-selected").each(function() {
                 var index = $( "#selectable li" ).attr('id');
                                   // But I want the ids of all the selected elements,
                                   // but the id of the first is just getting copied on my site!
                result.append( "#" + ( index + 1 ) );
            });
        }
    });
});

Answer 1

Try:

$(function() {
    $( "#selectable" ).selectable({
        stop: function() {
            var result = $( "#select-result" ).empty();
            $( ".ui-selected").each(function() {
                 var index = $( this ).attr('id'); 
                result.append( "#" + ( index + 1 ) );
            });
        }
    });
});