JSFiddle - React, Tailwind, and code Playground

HTML

<input class="red" type="text" value="Click here">
<span class="blue">Then here</span>
<ol class="results"></ol>

CSS

.red {
    color: #911;
}

.blue {
    color: #11B;
}

JavaScript

var logEvent = function(name, color) {
    $('.results').append($('<li>', {class: color, text: name}));
};

$('input').on('focus blur', function(event) {
    logEvent(event.type, 'red');
});

$('span').on('click mousedown mouseup', function(event) {
    logEvent(event.type, 'blue');
});