jQuery.on(event, selector, callback) in pure js, requies 'querySelectorAll'

filterEventHandler.js

/*
 * how to use:
 * fn: filterEventHandler(selector, callback)
 *    selector: selector for querySelectorAll, filtering event source, like jQuery.on(event, selector, callback)
 *    callback: event handler function
 *    returns: filtering function which contains reference of your callback
 *
 * code:
 *    element.addEventListener('eventname', filterEventHandler('.filter[selector*="for querySelectorAll"]', function (e) {
 *        // this code will be called only when element matched to selector
 *        console.log(e.filterdTarget, "This is matched element. You can use e.target as original source element.");
 *    }));
 *  or
 *    element.onEvent = filterEventHandler('.selector', function (e) { console.log("matched!"); });
 *
 * license: public domain
 * author: <lianol> https://github.com/a-c-t-i-n-i-u-m
 */

var filterEventHandler = function (selector, callback) {
    return (!callback || !callback.call) ? null : function (e) {
        var target = e.target || e.srcElement || null;
        while (target && target.parentElement && target.parentElement.querySelectorAll) {
            var elms = target.parentElement.querySelectorAll(selector);
            for (var i = 0; i < elms.length; i++) {
                if (elms[i] === target) {
                    e.filterdTarget = elms[i];
                    callback.call(elms[i], e);
                    return;
                }
            }
            target = target.parentElement;
        }
    };
};