JSFiddle - React, Tailwind, and code Playground

HTML

<div class="hasOnClick">
Has onclick
</div>
<div class="foo">
No onclick
</div>
<div class="hasOnClick">
<span>Has onclick</span>
</div>

CSS

div {
  padding:1em;
  margin:1em;
  background:#dadada;
}

JavaScript

const delegateEventListener = ( event, selector, fn ) => document.addEventListener( event, e => {
	const elements = [...document.querySelectorAll( selector )];
	if( elements.includes( e.target ) || elements.some( element => element.contains( e.target ) )){
  	fn(e);
  }
});

delegateEventListener("click", "div.hasOnClick", e => {
	console.log( e );
})