Adding a javascript event to a dynamically loaded content

Question

Hello,
I am new to adobe air. I am trying to create a desktop application with html and javascript. I have a page that reads data from db and lists each  records as links (a href). I need to assign an onclick event for each link.
both
foreach result {
     <a href="#" onclick="foo()">bla bla</a>
and
foreach result {
     document.getElementById('container').innerHTML = '<a href="#" id="link_id">bla bloa</a>';
     document.getElementById('link_id').addEventListener("click", function() { foo(); });
With the second  solution it  only workd  for the last record
What am I missing ?
I appreciate any help.
Thanks.

Answer 1

I always recommend using a javascript framework such as jQuery for building JS AIR applications. If you're already using jQuery, or plan on it then look into jQuery's live binding:
http://api.jquery.com/live/
Essentially what it does is "listen" for new DOM elements that match events you're watching for and add them to your existing bindings. It's very simple. Your example below becomes:
$('a').live('click', function(){
     // do something