JQuery onclick not running for link on page

<li class="ui-li ui-li-static ui-body-c">
    <p class="ui-li-aside ui-li-desc"></p>
    <span id="122"></span>
    <h3 class="ui-li-heading"></h3>
    <p class="ui-li开发者_高级运维-desc"></p>
    <p class="ui-li-desc"><a class="ui-link">Report</a></p>
</li>

So I dynamically add a bunch of these list items to my JQuery mobile page when the page loads. As the page is up, I am also refreshing them every 5 seconds.

I want to perform a click function if you click the Report link though (this might get a little bit wonky with when you do it though?), so I have this code to do it:

$('a.ui-link').click(function(){
    alert('report');
});

But I'm not getting any alert when I click it.

How would I go about doing this?

Thanks!

Use the live() method to attach the handler to dynamically added elements that match the selector:

$("a.ui-link").live("click", function(){ alert("report"); });

If the a.ul-links are the children of a certain element with an id, you can use the delegate() method instead for better performance:

$("#parent").delegate("a.ui-link". "click", function(){ alert("report"); });