نمایش رمزعبور در جاوا اسکریپت

سلام دوستان من میخوام وقتی کاربر روی دکمه نمایش رمزعبور کلیک کرد رمز نمایش داده بشه این کدم نمیدونم کجاش ایراد داره ممنون میشم راهنماییم کنید.
html:

<div class="col-sm-4 checkout__input--list">
                                            <label for="password">رمزعبور</label>
                                            <input type="password" placeholder="رمزعبور" name="password" class="account__login--input passwordInput" id="password">
                                            <div class="account__login--remember position__relative showPassword">
                                                <input class="checkout__checkbox--input " id="check3" type="checkbox">
                                                <span class="checkout__checkbox--checkmark showBtn"></span>
                                                <label class="checkout__checkbox--label login__remember--label" for="check3">
                                                    نمایش رمز عبور</label>
                                            </div>
                                        </div>

و کد js:

const passwordInput = document.querySelector(".passwordInput");
const showPassword = document.querySelector(".showPassword");
showPassword.addEventListener("click", function() {
if (passwordInput.type === "password") {
    passwordInput.type = "text";
} else {
    passwordInput.type = "password";
}
})