Javascript .innerHTML restablece mi <input type = "file">

Tengo un problema relacionado con la carga de múltiples archivos en javascript. Estoy tratando de crear mi propia carga de archivos múltiples agregando dinámicamente entradas. Todo esto es fácil, pero el problema es que cada vez que agrego uno nuevo, mis campos de entrada anteriores del tipo "archivo" se restablecen.

Si elimino las últimas líneas de código donde modifico el innerHTML de mi div principal, los valores de mi no se restablecen. ¿Alguien sabe cómo se puede resolver este problema? El código de JavaScript se puede encontrar a continuación. Gracias por adelantado

if(document.getElementById("upload_queue").innerHTML.indexOf(_item) == -1)
{
    var _row = "<tr id='queue_row_" + items_in_queue + "'>";
    _row += "<td>";
    _row += "<div class='remove_uploaded_image' onclick='remove_from_queue(" + items_in_queue + ")'></div>";
    _row += "</td>";
    _row += "<td>";
    _row += _item;
    _row += "</td>";
    _row += "</tr>";

    document.getElementById("upload_queue").innerHTML += _row;
    document.getElementById("upload_image_" + items_in_queue).style.display = "none";

    items_in_queue++;

    document.getElementById("uploader_holder").innerHTML += 
        '<input id="upload_image_' + items_in_queue + 
        '" name="upload_image_' + items_in_queue + '" accept="image/jpeg" type="file"' + 
        'onchange="add_to_upload_queue()" style="display: inline;" />';
}

Respuestas a la pregunta(1)

Su respuesta a la pregunta