Attach additional click event to the jQuery UI Selectable

Question

   $('#all_locations').selectable({ 
   stop: function(){
    var selected = new Array() ;
    $('.ui-selected', this).each(function(){
     var content = $(this).html();
     selected.push(content);
    });
    if(selected.length == 1) {
       var words = selected.toString().split(':') ;
       var label = words[0];
       var lat_long = words[1] ;
       var another_words = lat_long.split(',') ;
       var latitude = another_words[0] ;
       var longitude= another_words[1] ;

       $('#latitude').val(latitude);
       $('#longitude').val(longitude);
       $('#label').val(label);
    } 
   }
  })

     $('#all_locations li').live('click',
    function(e){ 
            alert($(this).html());
       });

The HTML

      <ol id="all_locations">
 <li class="ui-widget-content location">Universitas Negeri Jakarta : -6.18783,106.878347</li>
 <li class="ui-widget-content location">Universitas Indonesia, Depok : -6.365895,106.826245</li>
 <li class="ui-widget-content location">Universitas Pancasila :  -6.326218,106.833286</li>
 <li class="ui-widget-content location">Universitas Gajah Mada: -7.72358,110.377579</li>
 </ol>

The additional click event didn't work. If i disable the selectable, the additional click event was fire.

is there any way to add additional click event to the selectable list ?