JSFiddle - React, Tailwind, and code Playground

HTML

<input type="file" multiple />

JavaScript

var input = $('#input');
var status = $('#status');
var ficheiros = input.get().map(function(input, i) {
    returninput.files[i];
});
ficheiros.forEach(function(ficheiro) {

    $.ajax({
        url: 'upload-file.php',
        contentType: false,
        processData: false,
        data: (new FormData()).append('file', ficheiro),
        beforeSend: function(file, ext) {
            if (!(ext && /^(jpg|png|jpeg|gif)$/.test(ext))) {
                // verificar a extensão de arquivo válido
                status.text('Somente JPG, PNG ou GIF são permitidas');
                return false;
            }
            status.append('Enviando ' + ficheiro + '<br />');
        },
        success: function(file, response) {
            //Limpamos o status
            status.append('Sucesso ao enviar o ficheiro');
            //Adicionar arquivo carregado na lista
            if (response === "success") {
                $('<li></li>').appendTo('#files').html('<img src="./uploads/' + file + '" alt="" /><br />' + file).addClass('success');
            } else {
                $('<li></li>').appendTo('#files').text(file).addClass('error');
            }
        }
    });
});