Native JavaScript: Event Handling of Dynamic HTML Elements

In jQuery, if you dynamically add an element to the DOM and want to attach an event handler to it, that’s very easy with the following line of code.

However, if you try to do that with native Javascript, you have to do with by checking for all clicks on the page and only acting on clicks where the click occurred on the element you want to act on.

Obviously that’s no good. One workaround is to put the HTML element in the page somewhere(if that’s possible in your case), then detach and attach it to where you want to dynamically put it, then add an event listener specifically for that element, e.g.