Why am I getting jquery .load() status as blank?

Question

Please check the javascript part of the code. When I click on the link, I want it to load a specific page into "content" div while showing "loading" div while the page is being fetched. I also want to make some other changes when the requested page has been loaded into the "content" div. How do I determine that the load has been successful? The "status" is always blank.

Edit: This is not a duplicate as suggested. My question doesn't ask about custom parameters.

 function ajaxload(status) { alert(status); if (status === "success") { $("div#loading").hide(); $("div#content").show(); $("input#keysearch").blur(); } else { var msg = "Sorry but there was an error"; $("div#loading").text(msg); } } $("div#keylist ul li").on("click", function(event) { event.preventDefault(); $("div#content").hide(); $("div#loading").show(); $("div#content").load("http://stacksnippets.net/js",ajaxload(status)); } ); 

 #loading { display:none; border: 1px solid #F00; bottom:0; left:15vw; width:70vw; height:80vh; overflow-y:auto; -webkit-overflow-scrolling: touch; padding:2vh 2vw; box-sizing: border-box; text-align:center; position: fixed; } #content { visibility:visible; border: 1px solid #F00; position:fixed; left:15vw; right:15vw; bottom:0; width:70vw; height:80vh; overflow-y:auto; -webkit-overflow-scrolling: touch; text-align:justify; z-index:0; padding:2vh 2vw; box-sizing: border-box; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div id="keylist"> <ul> <li><a href="">ABORT</a></li> <li><a href="">ABS</a></li> <li><a href="">ACCESS</a></li> </ul> </div> <div id="content"> </div> <div id="loading"> Loading... </div> 

Answer 1

Jquery function load() return status in second argument, Try to do it like following :

$( "div#content" ).load( "http://stacksnippets.net/js", function( response, status, xhr ) {
    ajaxload(status);
});

Hope this helps.