JSFiddle - React, Tailwind, and code Playground
HTML
<div id='foo'>
<div id='bar'>Click Me</div>
</div>
CSS
#bar {
border: 1px solid black;
padding: 5px;
}
JavaScript
document.onclick = function(event) {
console.log(
document.querySelectorAll("#bar")[0],
document.querySelector("#bar"),
document.getElementById("bar"),
$("#bar"),
$(document).find("#bar"),
$("html").find(event.target),
$(document).find(event.target),
event.target,
event.target.parentNode
);
};
document.getElementById('bar').onclick = function(event) {
document.getElementById("foo").innerHTML = '<h1>Replaced</h1>';
console.log('Replaced "#foo"');
};