title: how to upload multiple image with thumbnail and select one of them before upload
body: <p>I am working on quiz game where i need to upload multiple image with thumbnail before images upload but at the same time i must be able to select one image.Here purpose is i upload multiple image as option image and obviously one of the image is answer image between them.i need to store all the images URL and answer image URL in sepraet column of database. </p>
  
  <p>i tried multiple image upload with thumbnail but how to select one image from them i don't know.please help thanks in advance.</p>
  
  <p>i tried below code from <code>jsfiddel</code> </p>
  
  <pre><code>var inputLocalFont = document.getElementById("file");
  inputLocalFont.addEventListener("change",previewImages,false);
  
  function previewImages(){
      var fileList = this.files;
  
      var anyWindow = window.URL || window.webkitURL;
  
      for(var i = 0; i &lt; fileList.length; i++){
          var objectUrl = anyWindow.createObjectURL(fileList[i]);
          $('#imagePreview').append('&lt;img src="' + objectUrl + '" width="100" height="100"/&gt;');
          window.URL.revokeObjectURL(fileList[i]);
      }
  }
  </code></pre>
  
  <p>And html is</p>
  
  <pre><code>&lt;input id="file" type="file" name="file[]" multiple/&gt;
  &lt;div id="imagePreview"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>here is the url <a href="http://jsfiddle.net/7s9krm2h/" rel="nofollow">http://jsfiddle.net/7s9krm2h/</a>   </p>