JSFiddle - React, Tailwind, and code Playground

by timkl

HTML

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

CSS

input {
    border: 2px solid red;
}
input.inputnotext {
    border: 2px solid green;
}

JavaScript

var input = document.getElementsByTagName('input');

    keyupHandler = function(input){
        if (input.value.length){
            input.setAttribute('class', 'inputnotext');
        }
        else {
            input.setAttribute('class', '');
        }
    }
    
    for (i=0; i<input.length; i++){
        input[i].onkeyup = function(){
            keyupHandler(this);
        }
    }