Get the name node in the Kendo Multiple Select UI when you click

Question

I use the Kendo UI multiple choice, and I want the node name to be selected when you click on it. This happens not only when I press X to remove the node, although I also need a name when I delete it.

In this example , when I click on tags, I need names such as "Europe" and "Africa."

I tried this code, but it only works sometimes, and not when I press X

  $('.k-multiselect-wrap li .k-delete').click(function() { console.log('Select to remove it'); }); 

Answer 1

You need to use delegated events because the elements are added to the DOM after your initial binding, so the regular .click event .click won, work on any elements added in the future. For instance:

 $(document).on("click", "li.k-button span.k-icon.k-delete", function () { console.log("Clicked on X: " + $(this).siblings().first().text()); }); 

See update jsFiddle