JSFiddle - React, Tailwind, and code Playground

by konijn_gmail_com

HTML

<p id="help">Helpful notes will appear here</p>
<p>E-mail: <input type="text" id="email" name="email"></p>
<p>Name: <input type="text" id="name" name="name"></p>
<p>Age: <input type="text" id="age" name="age"></p>

JavaScript

function makeHelpCallback(i) {
    return function () {
        $("#help").text(i);
    };
}
(function () {
    var helpText = [
    { 'id': 'email', 'help': 'Your e-mail address' },
    { 'id': 'name', 'help': 'Your full name' },
    { 'id': 'age', 'help': 'Your age (you must be over 16)' }
    ];

    for (var i = 0; i < helpText.length; i++) {
        var item = helpText[i];
        $("#"+item.id).focus(function () {
            new makeHelpCallback(item.help)();
        });
    }
})();