Resizable does not work on dynamic image

Question

I have a tool that when the user sends any image the function resizable does not work, unlike the static image that is already on the site.

I projected online my doubt, on the following link: http://www.rafaelseverino.com/nav/resizable

If you have an alternative using jQuery, would be a good.

function doClick() {
  var el = document.getElementById("fileElem");
  if (el) {
    el.click();
  }
}

function handleFiles(files) {
    // onchange do formulário
    var d = document.getElementById("draggable");       
    var list = document.createElement("ul");        
    d.appendChild(list);
    for (var i=0; i < files.length; i++) {
        var li = document.createElement("li");
        list.appendChild(li);                       
        var img = document.createElement("img");
        img.width = 100;
        img.classList.add("ui-widget-content");
        img.classList.add("resizable");
        img.classList.add("ui-resizable");  
        img.src = window.URL.createObjectURL(files[i]);
        img.onload = function() {
            window.URL.revokeObjectURL(this.src);
        }
        li.appendChild(img);
    }
}
$(function() {
  // Redimensionameto que só está funcionando na imagem estática
    $( ".resizable" ).resizable({
        maxHeight: 194,
        maxWidth: 150,
        minHeight: 95,
        minWidth: 70
    });
});

Answer 1

Try running . resizable() after loading the image.