while getting a closer look at the AJAX Tutorial, I noticed that the codepen examples where not working.
A glane at the console tells me that this is because of a mixed content problem.
The Happy Coding tutorial is provided over https, while the json comes from a http location. The browser automatically blocks the mixing of encrypted and unencrypted data, blocking the ajax from ever receiving a response.
I admit I stopped my research there. Either the tutorial should be updated, or there’s a tweak I can do to my browser to allow mixed content? I don’t know, but certainly should tell you about it.
I actually had some trouble understanding ajax requests. But at some point during my investigating the problem in your example, I got around to fully comprhend when which part of the js code fires, processes and terminates. It’s quite a different order to the one you actually write the lines of code in, heh.