JSFiddle - React, Tailwind, and code Playground

HTML

<p id = "text"> click here </p>

JavaScript

var events = {
    
    addEvent : function(id, handler, type) {
        
        var elem = document.getElementById(id);
        if (elem.addEventListener) {
            return elem.addEventListener(type, handler, false);
        } 
        else { 
            return elem.attachEvent("on" + type, handler);
        }
    },
    
    removeEvent : function(id, handler, type) {
        
        var elem = document.getElementById(id);
        if (elem.removeEventListener) {
            return elem.removeEventListener(type, handler, false);
        } 
        else { 
            return elem.detachEvent("on" + type, handler);
        }
    }
};

var e = {
    //click
    addClick : function(id, handler) {
        
        var type = "click";
        events.addEvent(id, handler, type);
    },
    removeClick : function(id, handler) {
        
        var type = "click";
        events.removeEvent(id, handler, type);
    },
    //abort
    addAbort : function(id, handler) {
        
        var type = "abort";
        events.addEvent(id, handler, type);
    },
    
    removeAbort : function(id, handler) {
        
        var type = "abort";
        events.removeEvent(id, handler, type);
    },
    ////blur
    addBlur : function(id, handler) {
        
        var type = "blur";
        events.addEvent(id, handler, type);
    },
    
    removeBlur : function(id, handler) {
        
        var type = "blur";
        events.removeEvent(id, handler, type);
    }
};

function alerting() {
    alert("hello");
};

e.addClick("text", alerting);