How to asyncify Wistia API embed codes

gistfile1.html

<!-- A default Wistia embed code, plus the 'container' attribute so we can have multiples of the same video on the page. -->
<div id="wistia_4d8229898d_1" class="wistia_embed" style="width:640px;height:360px;" data-video-width="640" data-video-height="360">&nbsp;</div>
<script charset="ISO-8859-1" src="http://fast.wistia.com/static/concat/E-v1.js"></script>
<script>
wistiaEmbed1 = Wistia.embed("4d8229898d", {
  version: "v1",
  videoWidth: 640,
  videoHeight: 360,
  container: "wistia_4d8229898d_1"
});
</script>


<!--
An asyncified Wistia embed code, plus the 'container' attribute so we can have multiples of the same video on the page.

As you can see, this is much longer and uglier, which is why we don't provide it from the app.
-->
<div id="wistia_4d8229898d_2" class="wistia_embed" style="width:640px;height:360px;" data-video-width="640" data-video-height="360">&nbsp;</div>
<script>
function runScript(src, callback) {
  var s = document.createElement("script");
  var s1 = document.getElementsByTagName("script")[0];
  s.type = "text/javascript";
  s.async = true;
  s.src = src;
  var done = false;
  s.onreadystatechange = s.onload = function() {
    var state = s.readyState;
    if (!done && callback && (!state || /loaded|complete/.test(state))) {
      done = true;
      callback();
    }
  };
  s1.parentNode.insertBefore(s, s1);
}
runScript("http://fast.wistia.com/static/concat/E-v1.js", function() {
  window.wistiaEmbed2 = Wistia.embed("4d8229898d", {
    version: "v1",
    videoWidth: 640,
    videoHeight: 360,
    container: "wistia_4d8229898d_2"
  });
});
</script>


<!--
If you have a framework that can execute a script followed by a success callback (this is quite common), then it becomes a bit simpler.

This example uses jQuery's getScript() function.
-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<div id="wistia_4d8229898d_3" class="wistia_embed" style="width:640px;height:360px;" data-video-width="640" data-video-height="360">&nbsp;</div>
<script>
$.getScript("http://fast.wistia.com/static/concat/E-v1.js", function() {
  window.wistiaEmbed3 = Wistia.embed("4d8229898d", {
    version: "v1",
    videoWidth: 640,
    videoHeight: 360,
    container: "wistia_4d8229898d_3"
  });
});
</script>

<!--
Here's an example with requirejs, which is made specifically for this kind of stuff.

This example assumes that requirejs is already included on the page, and is therefore nonfunctional with this markup alone.
-->
<div id="wistia_4d8229898d_4" class="wistia_embed" style="width:640px;height:360px;" data-video-width="640" data-video-height="360">&nbsp;</div>
<script>
require(["http://fast.wistia.com/static/concat/E-v1.js"], function() {
  window.wistiaEmbed4 = Wistia.embed("4d8229898d", {
    version: "v1",
    videoWidth: 640,
    videoHeight: 360,
    container: "wistia_4d8229898d_4"
  });
});
</script>