JSFiddle - React, Tailwind, and code Playground

by David Thomas

HTML

<form action="#" method="post">
    <fieldset>
        <legend>Simple demo</legend>
        <label for="name">Text Input:</label>
        <input type="text" name="name" id="name" value="" tabindex="1" />
    </fieldset>
</form>

CSS

form {
    border: 2px solid #000;
    padding: 1em;
}
form.hasInputChanged {
    border-color: limegreen;
}

JavaScript

$('form').on('change', 'input[type=text]', function (e) {
    var ancestorFormElement = this.form;

    $(ancestorFormElement).toggleClass('hasInputChanged', this.value !== this.defaultValue);
});