JSFiddle - React, Tailwind, and code Playground

by scispear

HTML

<input id="text" />
<div id="events"></div>

CSS

div { border: 1px solid #ddd; }

JavaScript

var events = $('#events'),
    count = 0;

$('#text').on('focusout', function(){ events.prepend($('<div>').html(++count+': focustout')); })
    .on('blur', function(){ events.prepend($('<div>').html(++count+': blur')); })
    .on('focusin', function(){ events.prepend($('<div>').html(++count+': focusin')); })
    .on('change', function(){ events.prepend($('<div>').html(++count+': change')); });