http://jsfiddle.net/walkerneo/QqkkA/

Я видел здесь много вопросов, которые либо задавали вопросы, либо отвечали на вопросы делегирования событий в javascript, но я еще не видел, как использовать делегирование событий для элементов, которые не будут являться целью события click.

Например:

HTML:

<ul>
    <li><div class="d"></div></li>
    <li><div class="d"></div></li>
    <li><div class="d"></div></li>
    <li><div class="d"></div></li>
    <li><div class="d"></div></li>
    <li><div class="d"></div></li>
</ul>​

CSS:

ul{
    padding:20px;
}
li{
    margin-left:30px;
    margin-bottom:10px;
    border:1px solid black;

}
.d{
    padding:10px;
    background:gray;
}
​

Что делать, если я хочу добавить событие щелчка для обработкиli элементы, когда они нажали? Если я прикреплю обработчик события кul элемент,divs всегда будет целевым элементом. Как проверить это, кроме проверки каждого родителя целевого элемента в функции щелчка?

редактировать:

Я хочу использовать делегирование событий вместо:

var lis = document.getElementsByTagName('li');
for(var i=0;i<lis.length;i++){
    lis[i].onclick = function(){};
}

Но если я сделаю:

document.getElementsByTagName('ul')[0].addEventListener('click',function(e){

    // e.target is going to be the div, not the li
    if(e.target.tagName=='LI'){

    } 
},false);

РЕДАКТИРОВАТЬ:Меня не интересует, как использовать библиотеки Javascript для этогоМне интересно, как они это делают и как это можно сделать с чистым js.