JSFiddle - React, Tailwind, and code Playground
HTML
<input type="text" class="empty" />
CSS
.empty {
border: 1px solid red;
}
.full {
border: 1px solid green;
}
input {
margin: 10px;
width; 100px;
}
JavaScript
var track = function() {
if($(this).val().length == 1){
$(this).removeClass('empty').addClass('full');
} else {
$(this).removeClass('full').addClass('empty');
}
}
$('input').keyup(track);