Добавить класс в дочерний элемент, но не к родительскому

Question

Я хочу добавить класс к одному элементу за раз. Элемент может быть дочерним элементом родительского элемента, к которому также применяется событие click. Какой лучший способ добавить класс только к дочернему элементу, но не к родительскому. Вот пример, нажмите на дочерний div и убедитесь, что класс также добавлен ко всем родительским элементам. Я могу придумать несколько способов сделать это, но я хочу убедиться, что Im использует лучшее решение. В основном я хочу, чтобы класс добавлялся только к элементу, который был нажат независимо от его родителей с тем же классом.

http://codepen.io/anon/pen/aiGJb

<div id="parent" class="element"> 
    <div id="child" class="element"> 
    <div id="childdd" class="element"></div> 
    </div> 
</div> 

Answer 1

Я думаю, ваша проблема в "кипящий".
Вот отличное объяснение того, как работает эта «пузырьковая» магия.
«Bubbling и захват» статья: http://javascript.info/tutorial/bubbling-and-capturing

Ваше решение, чтобы остановить «кипящий» с помощью return false; в конце вашего щелчка обработчика:

$(".element").on("click", function() { 
    $(this).addClass("active"); 
    return false; 
});