JSFiddle - React, Tailwind, and code Playground

by Louis Tsang

HTML

<body>
  <div>
    <ul>
      <li>Click Me!</li>
    </ul>
  </div>
</body>

JavaScript

var _div = document.querySelector("div");
var _ul = document.querySelector("ul");
var _li = document.querySelector("li");

//Capturing
_div.addEventListener("click", callback, true);
_ul.addEventListener("click", callback, true);
_li.addEventListener("click", callback, true);

//Bubble
_div.addEventListener("click", callback, false);
_ul.addEventListener("click", callback, false);
_li.addEventListener("click", callback, false);

function callback(event){
	var event = event || window.event;
    var _currentTarget = event.currentTarget
    alert(_currentTarget + " capturing");
}