Event Delegation

example from http://coding.smashingmagazine.com/2010/04/20/seven-javascript-things-i-wish-i-knew-much-earlier-in-my-career/

by bjelline

HTML

<h2>Great Web resources</h2>
<ul id="resources">
  <li><a href="http://opera.com/wsc">Opera Web Standards Curriculum</a></li>
  <li><a href="http://sitepoint.com">Sitepoint</a></li>
  <li><a href="http://alistapart.com">A List Apart</a></li>
  <li><a href="http://yuiblog.com">YUI Blog</a></li>
  <li><a href="http://blameitonthevoices.com">Blame it on the voices</a></li>
  <li><a href="http://oddlyspecific.com">Oddly specific</a></li>
</ul>

JavaScript

function handler(e) {
    var x = e.target; // get the link 
    if (x.nodeName.toLowerCase() === 'a') {
        alert('Event delegation:' + x);
        e.preventDefault();
    }
};

document.getElementById('resources').addEventListener('click', handler, false);