JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" id="giraffe" />

CSS

input:focus {
    outline: none;
}
.error-input-border {
    border: 1px solid #FF0000;
}

JavaScript

document.getElementById('giraffe').oninput = function() { this.classList.add('error-input-border'); }