Change the function of the Reset Variation button on WooCommerce variable products

Question

When the user clicks on reset, instead of the default functionality (which de-selects all variation attributes), I want the default variation to be selected (the way it is when the page is loaded). I want to achieve this without refreshing the page, refreshing would have the same end result but is too slow.

I have some javascript that does the job of selecting the default variation

 for (const property in default_attr) {
                if(default_attr[property] == undefined) {
                    jQuery('select[data-attribute_name="'+ property +'"]').prop('selectedIndex',0);
                    var thSelector = 'ul[data-attribute_name="'+ property +'"] li';
                    jQuery(thSelector).removeClass('selected');
                } else {
                    jQuery('select[data-attribute_name="'+ property +'"]').val(default_attr[property]);
                    var thSelector = 'ul[data-attribute_name="'+ property +'"] li[data-value="'+ default_attr[property]+'"]';
                    jQuery(thSelector).click().addClass('selected');
                }
                
            } 

But when I've incorporated it, the default code still runs first, so the user sees all the attribute get un-selected then the default variation being selected, which looks crap.

How can I run my javascript instead of the default reset functionality?

Or better what could I put in my functions.php, so that when Reset is clicked, the site runs the code that runs when the page is loaded which selects the default variation?

Hope this all made sense this is my first post here. Cheers