It's a scope issue.
$(document).ready(function() {
$("span").each(function (i) {
var mySpan = this; // set mySpan
$.get("myfile.php", { target: this.id, key: "value" },
function(data) {
// alert("Data Loaded: " + data);
// mySpan will be accessible in here
mySpan.innerHTML = data;
}
);
});
});
On Jul 16, 11:54 am, ajaxer <brandyloves...@gmail.com> wrote:
> As soon as the page loads, I would like to iterate through several
> span tags on the page and update their innerHTML to be the response
> from the AJAX get call. The line I have commented out, alert("Data
> Loaded: " + data);, works perfectly, but creates a bunch of alert
> boxes (which I don't want). And if I move the line "this.innerHTML =
> data;" out of the Ajax call, it works fine also. So I know all the
> syntax is correct. But when I put it together as outlined below, it
> just won't work. The Ajax is working, I also see the GET calls
> working fine in the Firebug console. It just won't update the
> innerHTML of the SPAN tags.
>
> Please, any help would be greatly appreciated!
>
> $(document).ready(function() {
> $("span").each(function (i) {
> $.get("myfile.php", { target: this.id, key: "value" },
>
> function(data){
> // alert("Data Loaded: " + data);
> this.innerHTML = data;
> });
>
> });
>
> });
>
>
