Event delegation snippet

utility_event_delegation.js

/**
 * Based on jQuery $.on API
 * Helpful when trying to bind to an element that might get re-renderd in future
 * because of some AJAX call or some other DOM manipulation
 * that required detaching the element or it's parent from the DOM.
 * Saves the extra code to re-attach all the event handlers.
 */
const delegateEvent = (el, evt, sel, handler, useCapture) => {

    if(typeof useCapture === 'undefined') {
        useCapture = false;
    }

    el.addEventListener(evt, function(event) {
        var t = event.target;
        while (t && t !== this) {
            if (t.matches(sel)) {
                handler.call(t, event);
            }
            t = t.parentNode;
        }
    }, useCapture);
};