jQuery selectable items --> get only selected

I'm trying to capture a list of selected items from jQuery selectable.

https://jsfiddle.net/cloudsea/bdgjdq7a/30/

 $(".platemap").selectable();

    function getSelected() {
       var selectedVals = [];
      $('.platemap .ui-selected').each(function(k,v) {
            selectedVals.push($(v).text());
        });
        alert(selectedVals);
    }

$('#getVals').click(function() {
    getSelected();
});

Currently, it is returning all items, rather than just the selected ones.

Thanks a lot in advance.

You missed item class in your jQuery selector:

$(".platemap").selectable();

function getSelected() {
    var selectedVals = [];
    $('.platemap .item.ui-selected').each(function(k,v) {
        selectedVals.push($(v).text());
    });
    alert(selectedVals);
}

$('#getVals').click(function() {
    getSelected();
});