jquery find and replace string in script code then run this script?

Question

Unfortunately I have to use VPN to visit google, including recapcha. Some chrome extensions can redirect those to recaptcha.net, otherwise I won't see captcha at all.....works in most cases, but sometimes not. Now I got this site, the source code shows replacement did not happen. It's like:

<div class="gglcptch gglcptch_v3"><input type="hidden" id="g-recaptcha-response" name="g-recaptcha-response"> <script src="https://www.google.com/recaptcha/api.js?render=6LesAYIUAAAAAMj2s2eUJfWEJNiAZTdeGONG5r5w"></script>
                            <script>
                              grecaptcha.ready(function() {
                                  grecaptcha.execute('6LesAYIUAAAAAMj2s2eUJfWEJNiAZTdeGONG5r5w', {action: 'BWS_reCaptcha'}).then(function(token) {
                                    document.querySelectorAll( "#g-recaptcha-response" ).forEach( elem => ( elem.value = token ) );
                                  });
                              });
                             </script></div>

So I essembled this code:

$(document).ready(function(){

$('.gglcptch gglcptch_v3').html(function(index,html){
    return html.replace(/www\.google\.com\/recaptcha\//g,'recaptcha.net/recaptcha/');
});


}); 

Chrome dev did not show error, but still replacement not happening. So my guess is the sequence? when document.ready, script already done running? What should I do？

Answer 1

1. Your selector is wrong. Should be like the below one:

$('.gglcptch.gglcptch_v3').html(
   // ... your function
)

$(document).ready(function(){

$('.gglcptch.gglcptch_v3').html(function(index,html){
    return html.replace(/www\.google\.com\/recaptcha\//g,'recaptcha.net/recaptcha/');
});

console.log($('.gglcptch.gglcptch_v3 script').attr('src'))

}); 

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="gglcptch gglcptch_v3"><input type="hidden" id="g-recaptcha-response" name="g-recaptcha-response"> <script src="https://www.google.com/recaptcha/api.js?render=6LesAYIUAAAAAMj2s2eUJfWEJNiAZTdeGONG5r5w"></script>
                            <script>
                              grecaptcha.ready(function() {
                                  grecaptcha.execute('6LesAYIUAAAAAMj2s2eUJfWEJNiAZTdeGONG5r5w', {action: 'BWS_reCaptcha'}).then(function(token) {
                                    document.querySelectorAll( "#g-recaptcha-response" ).forEach( elem => ( elem.value = token ) );
                                  });
                              });
                             </script></div>

2. But this won't replace google recaptcha to any other external source.

when document.ready, script already done running?

The answer is: Yes.

3. You should load external script(from recaptcha.net or so). See e.g. this link: JavaScript - function to load external JS files is needed