JSFiddle - React, Tailwind, and code Playground

by timkl

HTML

<div id="login-box">
    <input type="text" name="username" value="1" id="username" />
    <input type="text" name="password" value="2" id="password" />
    <input type="submit" name="login" id="login" />
</div><!-- /login-box -->

CSS

.value {
    background: green;
    }

.noValue {
    background: red;
    }

JavaScript

$('#login-box input').focus(function() {
    


    var loginValue = $('#login-box input').val();

      
    if(loginValue == "") {
        alert("noValue");
        $(this).addClass("noValue");
    }
   
    if(loginValue == "") {
        alert("value");
        $(this).addClass("value");
    }

});