Stackoverflow - https://stackoverflow.com/questions/49087024/error-classes-do-not-show-up-when-form-is-submitted

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
    <title>Document</title>
</head>
<body>
    <div class="index-bg-wrapper">
        <div class="main-signup-container">
                 <form id="signupForm" class="signup-form">
                    <input id="signupFirst" type="text" name="first" placeholder="First Name">
                    <input id="signupLast" type="text" name="last" placeholder="Last Name">
                    <input id="signupEmail" type="text" name="email" placeholder="Email">
                    <input id="signupPassword" type="password" name="pwd" placeholder="Password">
                    <button type="submit" name="submit">Signup</button>
            </form>
        </div>
    </div>


    <script>
        $(document).ready(function(){
            function removeFeedback(){
                    $('input').each(function() {
                        $(this).removeClass("inputError");
                    });
            }

            $("#signupForm").submit(function(e) {
                removeFeedback();
                var errors = validateSignup();
                if (errors == "") {
                    return true;
                }else {
                    provideFeedback(errors);
                    e.preventDefault();
                    return false
                }
            });

            function validateSignup() {
                var errorFields = [];
                //Check required fields to see if they have anything in them
                if ($('#signupFirst').val() == "") {
                    errorFields.push('signupFirst');
                }
                if ($('#signupLast').val() == "") {
                    errorFields.push('signupLast');
                }

                if ($('#signupEmail').val() == "") {
                    errorFields.push('signupEmail');
                }

                if ($('#signupPassword').val() == "") {
                    errorFields.push('signupPassword');
                }

                if (!($('#signupEmail').val().indexOf(".") > 2) && ($('#signupEmail').val().indexOf("@"))){
                    errorFields.push('signupEmail');
                }
                return errorFields;
            }


            function provideFeedback(errorFields) {
                for (var i = 0; i < errorFields.length; i++) {
                    $("#" + errorFields[i]).addClass("inputError");
                    $("#" + errorFields[i] + "Error").removeClass("errorFeedback");
                }
                }
        });
    </script>

    <style>
        .inputError {
            background: red;
        }
    </style>
</body>
</html>

// Code goes here

/* Styles go here */