jquery - javascript's window.preview function -

i trying implement following code works fine 1 input file looking use same thing using 2 forms , 2 different divs.

window.preview = function(input) {      if (input.files && input.files[0]) {          $(input.files).each(function(){              var reader = new filereader();              reader.readasdataurl(this);              reader.onload = function(e) {                  $("#messages-list").append("<li class='text-message-img'><img class='thumb' src='" + e.target.result + "'></li>");              }          });      }  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <form id="picture-upload">      <span>          <img src="images/icons.png">          click upload      </span>      <input class="upload" type=file onchange="preview(this);" accept="image/*" value="">  </form>

but problem want use 2 form shows in different div. how can select 2 different form input , show result in 2 different divs?

you pass id of target element preview function:

window.preview = function(input, element) {     if (input.files && input.files[0]) {         $(input.files).each(function(){             var reader = new filereader();             reader.readasdataurl(this);             reader.onload = function(e) {                 $(element).append("<li class='text-message-img'><img class='thumb' src='" + e.target.result + "'></li>");             }         });     } } 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form id="picture-upload">     <span>         <img src="images/icons.png">         click upload     </span>     <input class="upload" type=file onchange="preview(this, '#messages-list');" accept="image/*" value=""> </form>