JSFiddle - React, Tailwind, and code Playground

HTML

<form class="form_box prefix_clear" method="get" action="#login">
    <div class="f-field">
        <label for="f-name">Username:</label>
        <br/>
        <input id="f-name" class="submit_text" type="text" name="username" />
        <p class="f-error case1">Please enter your username</p>
        <p class="f-error case2">Your username has to be at least 4 characters</p>
    </div>
    <div class="f-field">
        <label for="f-email">Email:</label>
        <br/>
        <input id="f-email" class="submit_text" type="text" name="email" />
        <p class="f-error case1">Please enter your email</p>
        <p class="f-error case2">Your email is not a valid format</p>
    </div>
    <div class="f-field">
        <label for="f-pwd">Password:</label>
        <br/>
        <input id="f-pwd" class="submit_text" type="password" name="password" />
        <p class="f-error case1">Please enter your password</p>
        <p class="f-error case2">Your password has to be at least 6 letters (A-Z, a-z, 0-9)</p>
    </div>
    <div class="prefix_clear">
        <input id="submit_btn" class="f-btn" type="submit" name="submit" value="Create Account" />
    </div>
</form>

JavaScript

$(document).ready(function () {
    $('#submit_btn').attr('disabled', 'disabled');

    var nameFlag = false;;
    var emailFlag = false;
    var pwdFlag = false;

    $('#f-name').focusout(function () {
        if ($(this).val() == '') {
            DisabledButton();
        } else if ($(this).val().length < 4) {
            DisabledButton();
        } else {
            EnabledButton();
            //alert(nameFlag);
        }
    });


    $('#f-email').focusout(function () {
        if ($(this).val() == '') {
            DisabledButton();
        } else if ($(this).val().length < 4) {
            DisabledButton();
        } else {
            EnabledButton();
            //alert(emailFlag);
        }
    });


    $('#f-pwd').focusout(function () {
        if ($(this).val() == '') {
            DisabledButton();
        } else if ($(this).val().length < 6) {
            DisabledButton();
        } else {
            EnabledButton();
        }
    });

    function EnabledButton() {
        $('#submit_btn').removeAttr('disabled');
    }

    function DisabledButton() {
        $('#submit_btn').attr('disabled', 'disabled')
    }
});