вложенный addEventListener
 

Доброго времени суток!
Столкнулся с такой ситуацией:
Скрипт динамически создает несколько таблиц. На каждую таблицу вешается обработчик onclick, вида:

var applyElement = document.querySelector('#test');
var someElement = document.createElement('div');
applyElement.append(someElement);

table.addEventListener('click'. function(target){
//Если event.target == <a> ченить делаем
//в общем то вся обработка это манипуляции стилями
//здесь пытаюсь добавить еще один обработчик на внешний элемент
someElement.addEventListener('click', function(){alert('Hello')});
})

Так вот: table вложена в someElement (если это имеет значение). Теперь при щелчке на элемент <a> внтри table срабатывает не только функция навешенная на него, но и второй обработчик, который весит на someElement! Т.е. увидим alert()
Другими словами ситуация такая: есть

<div id='one'>
    <div id='two'>
        <div id='three'>
        </div>
    </div>
</div>

если добавить обработчик события на id='three', который при наступлении события должен повесить обработчик на id='two', это обработчик сразу же и срабатывает.

Почему так происходит?

Сейчас обошел это так.

function test(){
 realFunction();
}
table.addEventListener('click' function(){
     someElement.addEventListener('clilck', test); //теперь все нормально
});

Правда вот контекст потеряла realFunction, но сейчас что-нибудь придумаю, недеюсь.

Prowler,
stopPropagation

рони,
блин! Точно, всплывает, а на нем как раз уже висит обработчик. Вот я... Спасибо, спасибо :-)