img.onload is not keeping the same size javascript

Question

I have array of base64 images im using img.onload method to resize them, im passing the width and the height through img.width and img.height but im always ending with same width and height of the last image.

I tried this answer JavaScript loop/scope issue with Image.onload() didn't work for me

var list = myimgs.length;
var base64List = [];
var myJSON;
  if(list != 0){
    for(var i = 0; i <list; i++){             
       var count = 0;  
       var img = new Image;
       img.onload = resizeImage();
       img.src = myimgs[i].src; 
       img.width= myimgs[i].width;
       img.height= myimgs[i].height;

   function resizeImage() {
      if((document.getElementById('editor').innerHTML.indexOf("base64") != -1)){
      emailBody = emailBody.replace(/<img src="data:image[^>]*>/g,"imageTag");
        var x = img.width;
        var y = img.height;

   var newDataUri = imageToDataUriWithoutChangingEquality(this, x, y);
   var base64 = newDataUri.match(/data:(.+);base64,(.+)/);
   var base64Number = Math.round((base64[2].length )*3/4);
   var dateTime = new Date().toLocaleString()

        var tmpDocument = {
            sobjectType: "Document",
            Name: 'Image ' +dateTime,
            ContentType:  'image/png',
            Body: base64[2]
            };
   base64List.push(tmpDocument);
   console.log(JSON.stringify(tmpDocument));
   myJSON = JSON.stringify(base64List);
        }
   count++;
      }
    }
  }