JSFiddle - React, Tailwind, and code Playground

HTML

<input type="file" id="file" name="file" />
<output id="list"></output>

JavaScript

document.getElementById('file').addEventListener('change', handleFileSelection, false);

function handleFileSelection(evt) {
    console.log(evt);
    var f = evt.target.files[0];
    var output = [];

    output.push('<li><strong>', JSON.stringify(f), '</strong> (', f.type || 'n/a', ') - ', f.size, ' bytes, last modified: ', f.lastModifiedDate, '</li>');
    document.getElementById('list').innerHTML = '<ul>' + output.join('') + '</ul>';
}