Как мне найти клиентскую Whidth и ClientHeight изображения, чей элемент был создан? ⇐ Jquery

[Anonymous]

У меня есть поле файла HTML для выбора нескольких изображений для загрузки. Я хочу получить клиенту -Whidth и ClientHeight первого изображения.
Я использовал jQuery для создания элемента изображения изображений. Я добавил элемент изображения в div , где должны появляться изображения. Я попытался найти клиентскую withidth и clientHeight изображения, но как клиентская witd , так и ClientHeight изображения были 0 . С другой стороны, естественная WWIDTH и NaturalHeight были правильно определены, как я могу получить правильную клиентскую Whidth и ClientHeight изображения, учитывая, что его элемент был создан через jQuery?
$('#image-upload').change(function(event){

const files = this.files;

if (!files.length) return;

let imageElement = '';

$.each(files, function (index, file){
const reader = new FileReader();

reader.onload = function (event){

let imgSrc = event.target.result;

imageElement = $('')
.attr('src', imgSrc)
.addClass('image')
.css({width: '100%', 'max-width': '100%', display: 'block'});

$('#div-container').append(imageElement);

if(index === 0){

$('.image').on('load', function () {

let image = document.getElementsByClassName('image')[0];

let naturalWidth = image.naturalWidth; //got correct width
let naturalHeight = image.naturalHeight; // got correct height
let renderedWidth = image.clientWidth; //gives 0
let renderedHeight = image.clientHeight; //gives 0
});
}
};

reader.readAsDataURL(file);
});

});


Подробнее здесь: https://stackoverflow.com/questions/796 ... as-created