JavaScript placement

In terms of javascript placement which of these should come first?

This would come first, followed by everything else under it, right?
const load = (function makeLoad() {

https://jsfiddle.net/ve3oLtu0/1/

const load = (function makeLoad() {
  "use strict";

  function _load(tag) {
    return function(url) {
      return new Promise(function(resolve) {
        const element = document.createElement(tag);
        const parent = "body";
        const attr = "src";
        element.onload = function() {
          resolve(url);
        };
        element[attr] = url;
        document[parent].appendChild(element);
      });
    };
  }
  return {
    js: _load("script")
  };
}());

(function iife() {
    "use strict";

    function show(el) {
        el.classList.remove("hide");
    }

    function hide(el) {
        el.classList.add("hide");
    }

    function coverClickHandler(evt) {
        const cover = evt.currentTarget;
        const thewrap = cover.parentNode.querySelector(".container");
        hide(cover);
        show(thewrap);
    }
    const cover = document.querySelector(".jacketa");
    cover.addEventListener("click", coverClickHandler);
}());

Unless i’m missing something, the two scripts do not have any conflicting or dependant statements, and so it wouldn’t matter which loads first.

I’m thinking this should, or my impression is this piece should always stay at the top of the code.

const load = (function makeLoad() {
  "use strict";

  function _load(tag) {
    return function(url) {
      return new Promise(function(resolve) {
        const element = document.createElement(tag);
        const parent = "body";
        const attr = "src";
        element.onload = function() {
          resolve(url);
        };
        element[attr] = url;
        document[parent].appendChild(element);
      });
    };
  }
  return {
    js: _load("script")
  };
}());