JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
    <body>
        <form action="#" method="POST" enctype="multipart/form-data">
            <input type="file" name="file1" /><br />

            <input type="submit" value="Upload Forms" />
        </form>
    </body>
</html>

JavaScript

var incr = 2;
jQuery(window).bind('load', function() {
    jQuery('input[type="file"]').change(input_change);
});

function input_change() {
    if ( jQuery(this).attr('value') == '' ) {
        var input    = jQuery(this).parent().find('input[type="file"]');
        var victim;
        var num_empty = 0;

        input.each(function() {
            if ( jQuery(this).attr('value') == '' ) {
                victim = this;
                num_empty++;
            }
        });

        if ( num_empty > 1 ) {
            victim = jQuery(victim);

            victim.next().remove();        // remove line break
            victim.remove();            // remove input
            incr--;
        }
    } else {
        if ( jQuery(this).parent().find('input[type="file"]:empty').length <= 1 ) {
            jQuery('<input type="file" name="file' + incr + '" /><br />').insertBefore(jQuery(this).parent().find('input').last());
            jQuery('input[type="file"][name="file' + (incr++) + '"]').bind('change',input_change);
        }
    }
}