JSFiddle - React, Tailwind, and code Playground

by adeneo

HTML

<input class="element" />
<br />
Triggered events
<div id="triggered"></div>
<br />
<p>Available Events</p>
<div id="events"></div>

JavaScript

var props = Object.keys(document.body).filter(function(x) {
    return x.indexOf('on') === 0;
}).map(function(x) {
    return x.replace('on','');
})

props.forEach(function(s) {
    document.getElementById('events').innerHTML += s + '&nbsp;&nbsp;<br>'
});

var events = props.join(' ');

var ev = [],
    timer;

$('body').on(events, '.element', function(e) {
    ev.push(e.type);
    timer = setTimeout(function() {
        $('#triggered').html(ev.join(' '))
        clearTimeout(timer);
        setTimeout(function() { ev = []; }, 50);
    }, 100);
});