我想动态地在jQuery函数中创建这个类似的HTML结构并附加到html标签id =“images”

Question

I am uploading images and want to show separate progress bar for each image.
This kind of similar structure I want to create dynamically in jQuery. Here I m trying to create img element uploaded by input file and want to create html container classname 'preview' and put into already created #images tag by using jQuery. Will you please anyone fix it? so frustrated and thanks in advance to all intelligent brains here.

 <div id="images"> // already exist

 <div class="preview" id="rand"> 
 <img src="background/balance.jpg" id="rand"/>
 <div class="progressbar" id="rand">
 </div> // this is the preview container to create and put by dynamically in jQuery function

 </div>

this is my jQuery function.

   function handleFile(files) {    
   for (var i = 0; i < files.length; i++) {
   var file = files[i];  

   var fileReader=new FileReader();  

   var rand = Math.floor((Math.random()*100000)+3);  /* this is created for assign id attribute to div and img tag to differentiate each other */

   var imageElem=document.createElement("img");  

      imageElem.id=rand;

      var div = document.createElement('div');

      div.className = 'preview';    

      div.id = rand;

      var progress = document.createElement('div');

      progress.className='progressbar';

      progress.id=rand;

      fileReader.onload = (function(img) 

  {                             
    return function(e) 
  { 

        img.src = e.target.result;   

   };

   }) (imageElem);  

      /* here I am trying to create that structure */ 

           document.getElementById("images").appendChild(imageElem); /* and need to append here */ 

           fileReader.readAsDataURL(file);  

        //   document.getElementById("areatext").style.display = "none";

           document.getElementById("submit1").style.display = "block";
           document.getElementById("submit2").style.display = "block";

            uploadFile(file,rand);  
   }  

   }
    function uploadFile(file,rand) {  

    var xhr = new Array();

    xhr[rand] = new XMLHttpRequest();  

    var formData = new FormData();  

    formData.append('myFile[]',file);  

    xhr[rand].upload.addEventListener("progress", function(e) {  

    if (e.lengthComputable) {  

    $(".progressbar[id='"+rand+"']").css("width",(e.loaded / e.total) * 100 + "%");

   }  

   }, false);  

   xhr[rand].open("POST", "drop.php");  

   xhr[rand].overrideMimeType('text/plain; charset=x-user-defined-binary');  

   xhr[rand].send(formData);  

   }