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"');
};