You need to provide a callback function for your photoExists
function. Something like this:
function photoExists(photo, callback) {
var http = jQuery.ajax({
type: "HEAD",
url: photo,
async: true,
success: function(){
callback(photo, true);
},
error: function(){
callback(photo, false);
}
});
}
Then use it like so:
for (var i = 0; i < photos.length; i++) {
var photo = photos[i].url;
// Only add a photo if its URL is valid
photoExists(photo, function(photo, isSuccessful){
if (isSuccessful) {
scroller.append("<li><img src='" + photo + "' /></li>");
} else {
console.log("Photo " + photo + " doesn't exist");
}
});
}
Added photo to callback function to avoid possible closure issues with the for loop