I'm trying to apply Smooth Zoom Pan on a dynamically loaded picture like this:

  <div id="imgDiv" class="img-fluid"></div>
  function createImg() {
        var div = $("#imgDiv");
        div.empty();
        var newImg = new Image();
        newImg.id = 'myImg';
        newImg.useMap = '#buildingMap'
        newImg.setAttribute('class', 'img-fluid');
        newImg.attr("src", 'data:image/jpg;base64, ' + imgContent);
        div.append(newImg);
   }

imgContent is Base64 content of the image that I'm get it from database with AJAX call.

After the image was created:

setTimeout(function () {
    $('#myImg').smoothZoom({
        width: 500,
        height: 500
    });
   }, 500);

As a result, I'm getting only a white empty div with borders

Any suggestions how to fix this?