Jquery Frontend Password Strength

form.html

<!-- Assumes that your project uses bootstrap 3 & jquery -->

<!-- Add this div for displaying the strength/suggestions. -->
<div id="passwordStrengthIndicator">
</div>

jquery-password-strength.js

$(document).ready(function() {

            //Your element ids go here
            const passwordInput = $('#password');
            const passwordConfirmInput = $('#confirmPassword');
            const passwordStrengthIndicator = $('#passwordStrengthIndicator');
            const formSubmitButton = $("#registerSubmitButton");

            passwordInput.add(passwordConfirmInput).on('keyup', function(e) {

                let matchingPasswords = false;
                if (passwordInput.val() !== ''
                    && passwordConfirmInput.val() !== ''
                    && passwordInput.val() !== passwordConfirmInput.val()) {
                    passwordStrengthIndicator.removeClass().addClass('alert alert-danger').html('Mismatch: Passwords do not match!');

                    matchingPasswords = false;
                    return false;
                }
                else if(passwordConfirmInput.val() !== ''){
                    matchingPasswords = true;
                }

                let validInput = false;
                // Min 10 char, must have lowercase and uppercase, symbol and number
                var strongRegex = new RegExp("^(?=.{10,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g");

                // Min 8 char, must have lowercase and uppercase, symbol and number
                var mediumRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g");

                if (strongRegex.test(passwordInput.val())) {
                    //its a strong password
                    passwordStrengthIndicator.removeClass().addClass('alert alert-success').html('<b>Strong Password:</b> Good Password!');
                    validInput = true;
                } else if (mediumRegex.test(passwordInput.val())) {
                    //its a medium password
                    passwordStrengthIndicator.removeClass().addClass('alert alert-info').html('<b>Medium Password:</b> This is okay but you can make your password stronger. <br/> Try adding more capital letters, more numbers and special characters!');
                    validInput = true;
                } else {
                    // its a weak password
                    passwordStrengthIndicator.removeClass().addClass('alert alert-danger').html('<b>Weak Password:</b> Password must be at least 8 characters long, use at least one symbol, number and capital letter.');
                    validInput = false;
                }


                if(validInput && matchingPasswords){
                    formSubmitButton.removeAttr('disabled');
                    passwordStrengthIndicator.removeClass().addClass('alert alert-success').html('Passwords OK & Matching: Good to Go!');

                } else {
                    formSubmitButton.attr('disabled','disabled');
                }
                return true;
            });

        });