javascript - Passing $(this) selector into nested functions -

so have script in place needs go through each p tag within parent div class name of entry-content , translate each 1 using google translate api.

so when user clicks link translate page english spanish function run:

function spanish() { $(".entry-content p").each(function(){       var text = $(this).html();         google.language.detect(text, function(result) {           google.language.translate(text, "en", "es", function(result) {            if (result.translation) {                 alert($(this).html());  //outputs null                 $(this).html(result.translation); //doesn't work             }           });         });       }); } 

the problem when iiget inner function $(this).html() comesback null , not able change current elements html in order change new translated text.

so guess question is: how pass current selected element nested functions?

thanks

you may store in local variable

the value of this relate context in function called. in example, you're passing function google.language.translate, , presumably, google.language.translate calls function.

however, if store value of $(this) when p, able use variable callback function.

function spanish() {     $(".entry-content p").each(function(){       var $this = $(this);       var text = $this.html();         google.language.detect(text, function(result) {           google.language.translate(text, "en", "es", function(result) {            if (result.translation) {                 alert($this.html());  //outputs null                 $this.html(result.translation); //doesn't work             }           });         });       }); }