You need to loop through the files array from the multiple input and use the FileReader API on each.

I've set up the HTML like this:

​<input type=file multiple=true id=files />

<input type=submit id=go/>

<div id=images></div>​​​​​​​​​​​​​​​​​​​​​​

Then the javascript as follows:

// set up variables

var reader = new FileReader(),

    i=0,

    numFiles = 0,

    imageFiles;



// use the FileReader to read image i

function readFile() {

    reader.readAsDataURL(imageFiles[i])

}



// define function to be run when the File

// reader has finished reading the file

reader.onloadend = function(e) {



    // make an image and append it to the div

    var image = $('<img>').attr('src', e.target.result);

    $(image).appendTo('#images');



    // if there are more files run the file reader again

    if (i < numFiles) {

        i++;

        readFile();

    }

};



$('#go').click(function() {



    imageFiles = document.getElementById('files').files

    // get the number of files

    numFiles = imageFiles.length;

    readFile();           



});

I've set up a JSFiddle to demo http://jsfiddle.net/3LB72/

You'll probably want to do more checks on whether the browser the user is using has FileReader and if the files they have chosen are image files.