JSFiddle - React, Tailwind, and code Playground

by Mahadevan Sivasubramanian

HTML

<div class="label">First Name</div><input type="text" id="firstname" name="firstname" /><br />
          <div class="label">Last Name</div><input type="text" id="lastname" name="lastname" /><br />
          <div class="label">Email</div><input type="text" id="email" name="email" /><br />
          <div class="label">Password</div><input type="password" id="password" name="password" /><br />
          <div style="margin-left:140px;"><input type="submit" name="submit" value="Submit" id="submit" /></div>

JavaScript

$('#submit').click(function (e) {
            var isValid = true;
            $('#firstname,#lastname,#email,#password').each(function () {
                if ($.trim($(this).val()) == '') {
                    isValid = false;
                    $(this).css({
                        "border": "1px solid red",
                        "background": "#FFCECE"
                    });
                }
                else {
                    $(this).css({
                        "border": "",
                        "background": ""
                    });
                }
            });
            if (isValid == false)
                e.preventDefault();

        });