I’m new to the field. It is wordpress contact form submission related question. Asked to change form submit button text into “submitting…” to prevent multiple form submission and reset it to “sent” after the mail sent.

I have tried this

<?php
    // Prevent Multi Submit on all WPCF7 forms
    add_action( 'wp_footer', 'prevent_cf7_multiple_emails' );
 
    function prevent_cf7_multiple_emails() {
    ?>
 
    <script type="text/javascript">
    var disableSubmit = false;
    jQuery('input.wpcf7-submit[type="submit"]').click(function() {
        jQuery(':input[type="submit"]').attr('value',"Sending...");
        if (disableSubmit == true) {
            return false;
        }
        disableSubmit = true;
        return true;
    })
    var wpcf7Elm = document.querySelector( '.wpcf7' );
    wpcf7Elm.addEventListener( 'wpcf7submit', function( event ) {
        let res = event.detail;
        if ("mail_sent" === res.status){
        jQuery(':input[type="submit"]').attr('value',"Sent");
        disableSubmit = false;
        }
    }, false );
 
    wpcf7Elm.addEventListener( 'wpcf7invalid', function( event ) {
        jQuery(':input[type="submit"]').attr('value',"Submit a Ticket")
        disableSubmit = false;
    }, false );
</script>
<?php
} ?>

and it change the text into “sending…” when I click on submit button. But after email sent, btn text does not changed into “Sent” it always shows as “sending…”. I think that’s because of these events does not triggered,i don’t know whether it is correct or not. It will big relief, if anyone can help me to get rid of this issue.
Also please ignore my language knowledge.