capbub

by azproduction

HTML

<div> <div> <div> <div> <div>
PewPewPewPew    
</div> </div> </div> </div> </div>

JavaScript

var divs = document.querySelectorAll('div');

function capturing(i, event) {
    //event.stopPropagation(); // uncoment to kills all events
    console.log('capturing', i);
}

function bubling(i, event) {
    console.log('bubling', i);
} 

for (var i = 0, c = divs.length; i < c; i++) {
    divs[i].addEventListener('click', bubling.bind(this, i), false); 
    divs[i].addEventListener('click', capturing.bind(this, i), true); 
}