var loadFile = function(event) { var output = document.getElementById('output'); output.src = URL.createObjectURL(event.target.files[0]); output.onload = function() { URL.revokeObjectURL(output.src) // free memory } }; <input type="file" accept="image/*" onchange="loadFile(event)"> <img id="output" width="25%" /> Here it displays or adds only one. I want multiple images one after one.