Question

I have an empty list at the start like this.

<ul id="list" data-role="listview" data-inset="true">
            </ul>

Within the document ready function, I call multiple

$('#list').append('<li id="a">A</li>').listview('refresh'); 

to the ul each having its own unique id. So the result should be like:

 <ul id="list" data-role="listview" data-inset="true">
      <li id="a">A</li>
      <li id="b">B</li>
 </ul>

But at the end of the body tag in HTML, when I try doing something like

 $('#list').children()

It comes up as empty set [].
Likewise when I attach a click event with something like $("#a").click(function{alert("A")}) it doesnt work at all as it doesnt recognize the #a since it was dynamically created maybe?

I hope someone can help me with whats going on and if there is a way around this.

Answer 1

you need to use jquery live function to bind events to dyanamicaly added data.Try this.

$("#a").live('click',function(){
alert("A");
});