JSFiddle - React, Tailwind, and code Playground
HTML
<div>
<a href="#">foo</a>
</div>
CSS
a { padding:10px 20px; color:#FEFEFE; background-color:#F40; display:block; display:inline-block; font-weight:700; text-decoration:none; }
div { padding:50px; background-color:#333; }
JavaScript
document.getElementsByTagName('div')[0].onclick = function() {
alert('div\'s handler fired');
};
document.getElementsByTagName('a')[0].onclick = function(e) {
alert('anchor\'s handler fired');
if (!e.stopPropagation) {
e.cancelBubble = true;
return;
}
e.stopPropagation();
};