Question

Could someone explain why the alert statement would return nothing when used in this context:

$(document).ready(function(){

    $.get("/getsomedata.php", function(data){
        $("#mydiv").append(data)     
      });

     alert($("#mydiv").html()); //outputs nothing

});

When this statement returns what you would expect:

$(document).ready(function(){

     $("#mydiv").append('some info')     
      alert($("#mydiv").html()); //outputs 'someinfo'

});

Answer 1

the .get isn’t blocking, the rest of your script continues to run while the document loads. To get it to work as you expect, put the alert inside the anonymous function you are providing. This is a callback function and will fire after the document is loaded. ie:

$(document).ready(function(){

$.get("/getsomedata.php", function(data){
    $("#mydiv").append(data);
    alert($("#mydiv").html()); // This won't fire til somedata.php is loaded
  });

});