Short answer: Your foo() method returns immediately, while the $ajax() call executes asynchronously after the function returns. The problem is then how or where to store the results retrieved by the async call once it returns.
Several solutions have been given in this thread. Perhaps the easiest way is to pass an object to the foo() method, and to store the results in a member of that object after the async call completes.
function foo(result) { $.ajax({ url: '...', success: function(response) { result.response = response; // Store the async result } });}var result = { response: null }; // Object to hold the async resultfoo(result); // Returns before the async completesNote that the call to foo() will still return nothing useful. However, the result of the async call will now be stored in result.response.