add ClickListener JQuery Mobile ListView

Question

I am not able to add clickListener to my dynamically created listView. I've tried te following at stackoverflow but it doesnt work

What is wrong and how do I solve it?

javascript/jquery

 parseContent: function() {

    $('#countries').append('<ul data-role="listview" id="mylistview" style="margin: 50px">');       
    $.each(jsonData, function(i, item) {

        console.log(item.stad); 
        $('#countries').append('<li> <img src=' + "res/flags/" + item.flag + ' id="icon">' + '<span id="listlabel">' + item.country + '</span></li>').listview().listview('refresh');
        $('#countries').hide().fadeIn(800);   
    });
    $('#countries').append('<ul>');

    /*
    $('#mylistview').on('click', function() {
        d.lg("Works"); // id of clicked li by directly accessing DOMElement property
    });
    */

     $('#mylistview').delegate('li', 'click', function () {
      alert($(this).attr('id'));
     });
}

html

   <div data-role="page" id="one">

            <div data-role="main" class="ui-content">


                <div id="countries">

                </div>

            </div>
    </div>

jquery mobile click() on listview

Answer 1

.delegate(...) is deprectated according to the JQuery docs.

Have you tried: $("#countries").on("click", "li", function() {})