OTP Countdown JavaScript Version 2 - Initial Page load countdown

 <button id="resendOtp" class="btn  mt-0 mb-3 d-block w-100" onclick="resendOtp()" type="button" style="border:0px solid  #1f3d88;
background:transparent;
color:#1f3d88;">
                        <i class="fa-solid fa-rotate-right"></i> &nbsp;
                        Resend OTP
                    </button>

                    <div id="countdown" style="display: block; text-align: center;
    font-size: 12px;
    color: #fdb827;">
                        Resend OTP in <span id="timer">120</span> seconds
                    </div>

                    <script>

                        function startCountdown() {

                            const resendButtonInit = document.getElementById("resendOtp");
                            resendButtonInit.disabled = true;
                            let seconds = 120;

                            // Function to update the countdown timer
                            function updateTimer() {
                                const timer = document.getElementById("timer");
                                timer.textContent = seconds;
                                seconds--;

                                if (seconds < 0) {
                                    // Hide the countdown when the timer reaches 0
                                    const countdownDiv = document.getElementById("countdown");
                                    countdownDiv.style.display = "none";
                                    resendButtonInit.disabled = false;
                                } else {
                                    // Continue updating the timer
                                    setTimeout(updateTimer, 1000);
                                }
                            }

                            // Start the countdown
                            updateTimer();
                        }

                        // Call startCountdown function when the page loads
                        window.onload = startCountdown;

                        var resendOtpBtn = document.getElementById("resendOtp");

                        resendOtpBtn.addEventListener('click',function(){
                            resendOtp();
                        });

                        function resendOtp() {
                            // Get the value of the textPhoneNumber input field
                            const phoneNumber = document.getElementById("textPhoneNumber").value;

                            // Disable the "Resend OTP" button
                            const resendButton = document.getElementById("resendOtp");
                            resendButton.disabled = true;

                            // Show the countdown timer
                            const countdownDiv = document.getElementById("countdown");
                            countdownDiv.style.display = "block";

                            let seconds = 120;

                            // Function to update the countdown timer
                            function updateTimer() {
                                const timer = document.getElementById("timer");
                                timer.textContent = seconds;
                                seconds--;

                                if (seconds < 0) {
                                    // Re-enable the button and hide the countdown when the timer reaches 0
                                    resendButton.disabled = false;
                                    countdownDiv.style.display = "none";
                                } else {
                                    // Continue updating the timer
                                    setTimeout(updateTimer, 1000);
                                }
                            }

                            // Start the countdown
                            updateTimer();

                            // Create a JSON object with the MobileNo property
                            const data = {
                                MobileNo: phoneNumber
                            };

                            // Send a POST request to the API endpoint
                            fetch("https://localhost:7146/api/security/resend-otp", {
                                method: "POST",
                                headers: {
                                    "Content-Type": "application/json"
                                },
                                body: JSON.stringify(data)
                            })
                                .then(response => {
                                    if (response.ok) {
                                        // Handle success
                                       //alert("OTP resend request successful");

                                    } else {
                                        // Handle errors
                                        alert("OTP resend request failed");

                                    }
                                })
                                .catch(error => {
                                    console.error("An error occurred:", error);

                                });
                        }
                    </script>