When you set a listener on dom:loaded, what happens is that any closures (anonyomous functions) inside that listener "close" around the current values found in the page at the moment that the event fires. Adding a new element to the page does not "open" those closures and give them access to the new elements, instead, they only know about what was there when the page was loaded.

In contrast, you can listen to the event you are interested in at a level of the DOM above where your elements are -- a parent into which you insert your new elements -- and because that parent was there when the page loaded, the listener will work. Try this modification of your code:

document.observe('dom:loaded'), function(){
   document.observe('click', function(evt){
      var elm;
// listen to all click events on buttons with 'remove-site- button' class
      if(elm = evt.findElement('.remove-site-button')) {
          var rsb = Event.element(eve).up('table').remove();


On Feb 3, 2011, at 3:55 PM, neorou wrote:

My question has to do with why the event listener at the end of my
javascript file does not 'listen' to the newly generated buttons in
the new 'site-info' tables. I am guessing it is because the new tables/
buttons were generated after the dom:loaded event at the document

You received this message because you are subscribed to the Google Groups "Prototype 
& script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com.
To unsubscribe from this group, send email to 
For more options, visit this group at 

Reply via email to