JSFiddle - React, Tailwind, and code Playground

HTML

<input type="file" />
<input type="file" />
<input type="file" />
<input type="file" />

JavaScript

var inputs = $('.inputs').get();
var status = $('#status');

function proximoAjax() {
    var proximo = inputs.shift();
    var data = (new FormData()).append('file', proximo.files[0])
    $.ajax({
        url: 'upload-file.php',
        contentType: false,
        processData: false,
        data: data,
        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) {
            proximoAjax();
            //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');
            }
        }
    });
}
proximoAjax();