JSFiddle - React, Tailwind, and code Playground

by Geon George

HTML

<div id="banner-message">
  <img src="" id="myimg" width=300><br>
  <input type="file"  id="myfile">
</div>

JavaScript

function readURL() {
					var myimg = document.getElementById("myimg");
          var input = document.getElementById("myfile");
          if (input.files && input.files[0]) {
            var reader = new FileReader();
            reader.onload = function (e) {
            console.log("changed");
              myimg.src = e.target.result;
            }
            reader.readAsDataURL(input.files[0]);
          }
}

document.querySelector('#myfile').addEventListener('change',function(){
    readURL()
});