JSFiddle - React, Tailwind, and code Playground

by Sean Wessell

HTML

<input type="file" id="file" />
<div id="result"></div>

JavaScript

$('#file').change(function (event) {

    var files = event.target.files; //FileList object
    var output = document.getElementById("result");

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

        //Only pics
        if (!file.type.match('image')) continue;

        var reader = new FileReader();

        reader.addEventListener("load", function (event) {

event.target.result 
        });

        //Read the image
        picReader.readAsDataURL(file);
    }

});