Fourth Attempt
You’ve probably noticed already that the last error in the console comes and goes. It depends on wether the javascript files get loaded from their remote location or from the browser’s cache. The error only appears in the former case, and it means that even if the script tags are getting appended in order, they are not getting executed in order, unless they don’t need to be downloaded at all.
This becomes interesting. To get rid of that error, we must guarantee that all scripts are always executed in order. Any combination of $.getScript(url, callback) won’t work because one of its features is that “The callback is fired once the script has been loaded but not necessarily executed.”
For this task I used then yepnope.js, a JavaScript library which instead “always executes things in the order they are listed“. So the plan is to remove all the scripts from the downloaded HTML, pretty much like we did with jQuery, and then make yepnope load and execute them in order.
My fourth attempt (open in jsFiddle):
{[ .disco-attempt4 | 1.hilite(=javascript=) ]}
produced this result:
Well, all of the above is true and should work not only in jsFiddle but also in any other Online JavaScript IDE [1]. But if you have Google Chrome, forget about all those tricks and use its Custom JavaScript Snippets [2] feature instead. It just works. It’s like having the power you get when developing extensions right from the console.
1: http://en.wikipedia.org/wiki/Online_JavaScript_IDE
2: https://developer.chrome.com/devtools/docs/authoring-development-workflow#snippets