03. Form-Validation

function validate() {

    let userInput = $('#username');
    let emailInput = $('#email');
    let passInput = $('#password');
    let passCheckInput = $('#confirm-password');
    let companyCheck = $('#company');
    let compNumber = $('#companyNumber');

    let regXUser = /^[^<_>]{3,20}$/;
    let regXEmail = /^.+@.*[.].*$/;
    let regXPass = /^\w{5,15}$/;
    let regXComp = /^\d{4}$/;


    $('#submit').on('click', function (e) {
        e.preventDefault();

    userInput.removeAttr("style");
    emailInput.removeAttr("style");
    passInput.removeAttr("style");
    passCheckInput.removeAttr("style");
    compNumber.removeAttr("style");

    if (regXUser.test(userInput.val()))
    {
        userInput.css('border', 'none');
    }
    else {
        userInput.css('border-color', 'red');
    }

    if (regXEmail.test(emailInput.val()))
    {
        emailInput.css('border', 'none');
    }
    else {
        emailInput.css('border-color', 'red');
    }

    if (regXPass.test(passCheckInput.val()) && regXPass.test(passInput.val()) && passInput.val() == passCheckInput.val())
    {
        passInput.css('border', 'none');
        passCheckInput.css('border', 'none');
    }
    else {
        passInput.css('border-color', 'red');
        passCheckInput.css('border-color', 'red');
    }
    if (regXComp.test(compNumber.val()))
    {
            compNumber.css('border', 'none');
    }
    else {
        compNumber.css('border-color', 'red');
    }

    if (companyCheck.is(':checked'))
    {
        if ($('#username').css('border-top-style') == 'none' && $('#email').css('border-top-style') == 'none' && $('#password').css('border-top-style') == 'none' && $('#confirm-password').css('border-top-style') == 'none' && $('#companyNumber').css('border-top-style') == 'none')
        {
            $('#valid').css('display', 'block');
        }
        else   {
            $('#valid').css('display', 'none');
        }
    }
    else if (!companyCheck.is(':checked')){
        if ($('#username').css('border-top-style') == 'none' && $('#email').css('border-top-style') == 'none' && $('#password').css('border-top-style') == 'none' && $('#confirm-password').css('border-top-style') == 'none')
        {
            $('#valid').css('display', 'block');
        }
        else    {
            $('#valid').css('display', 'none');
        }
    }});

    companyCheck.change(function () {
        if (companyCheck.is(':checked'))
        {
            $('#companyInfo').css('display', 'block');
        }
        else {
            $('#companyInfo').css('display', 'none');}
    })
}