JSFiddle - React, Tailwind, and code Playground

HTML

<form>
<input type="text" id="txt1" style="width:300px;margin:15px" />
<input type="button" id="btn" value="click here" class="medium required" onclick="return validate();"/>
</form>

CSS

form input[type="text"], form input[type="email"], form input[type="password"], form select, form textarea {
    border: 1px solid #CCCCCC;
    -moz-border-radius: 15px;
    padding: 2px 0;
}

JavaScript

function validate() {
    if (document.getElementById('txt1').value == '') {

        document.getElementById('txt1').style.borderLeft = "5px solid red";
        document.getElementById('txt1').style.borderTopColor = "#CCCCCC";
        document.getElementById('txt1').style.borderBottomColor = "#CCCCCC";
        return false;
    }


}