multiple progress bars / html5 file uploads
===

this isn't the whole code, but i think its the relevant parts. how can i make an individual progress bar created dynamically for each file dropped into a dropzone?

    function sendFile(file) {  
    xhr.upload.addEventListener('progress',function(ev){
    var bar = document.getElementById("progressBar");
    progressBar.value += percentComplete;
    }, false); 

    dropzone.ondrop = function(event) {  
    event.stopPropagation();  
    event.preventDefault();  

    var filesArray = event.dataTransfer.files;  
    for (var i=0; i<filesArray.length; i++) {  
    sendFile(filesArray[i]);  
    //trigger progress bar with sendFile

    document.getElementById('file').innerHTML +=     '<li>'+filesArray[i].name+'&nbsp;'+'<progress id="progressBar"     value="0" max="100"></progress></div></li>';   
    }
    }