Proper way to include one js file in another

Question

I tried both from this answer and none of them work:

$(function () {
  var imported = document.createElement('script');
  imported.src = '/assets/admin/receipt_zooming.js';
  document.head.appendChild(imported);

  $('.rotate-receipt').on('click', rotateImage());
  $('.zoom-in').on('click', zoomHandler('+'));
  $('.zoom-out').on('click', zoomHandler('-'));

// OR

  $.getScript('/assets/admin/receipt_zooming.js', function()
  {
    $('.rotate-receipt').on('click', rotateImage());
    $('.zoom-in').on('click', zoomHandler('+'));
    $('.zoom-out').on('click', zoomHandler('-'));
  });
});

receipt_zooming file:

$(function () {
  return function() {
  var zoomHandler = function(sign) {
    return function() {
      var index = $(this).data('button-index');
      var image = $('#receipt-image-' + index);
      switch (sign) {
        case '+':
          image.width(image.width() + 100);
          break;
        case '-':
          image.width(image.width() - 100);
      }
    };
  };
  var rotateImage = function () {
    var angle = 0;
    return function() {
      var index = $(this).data('button-index');
      angle = (angle + 90)%360;
      var className = 'rotate' + angle;
      $('#receipt-image-'+index).removeClass().addClass(className);
    };
  };
}
});

I need to include the receipt_zooming.js in a few another files. Please help.

edit: Can I know why someone -1 instead of helping?

Answer 1

function loadScript(file) {
   var imported = document.createElement('script');
  imported.src = '/assets/admin/receipt_zooming.js';
  imported.type = "application/javascript";
  document.head.appendChild(imported);       
}