So I'm doing a simple multiple image upload script using javascript, but socket.io has to be used in order to get the image into the database. In order to run previews I have been taking **event.target.result** and putting it as the image src on a div. Is there any way I can store the this in an array for each image so that I can transfer it over the socket, and have it load on the other side? When I try to load it into an array, it's always undefined.

```
     for (var i = 0; file = files[i]; i++) {

        name[i] = files[i].name;

        // if the file is not an image, continue
        if (!file.type.match('image.*')) {
            continue;
        }

        reader = new FileReader();
        reader.onload = (function (tFile) {
            return function (evt) {
                var div = document.createElement('div');
                var miniDiv = document.createElement('div');
                div.id = "photoDiv";
                div.innerHTML = '<img style="width: 120px; height: auto;" src="' + evt.target.result + '" />';
                div.className = "photos";

                var data = evt.target.result;
                picture[i] = data;
                document.getElementById('filesInfo').appendChild(div);
                document.getElementById('previewDiv').appendChild(document.getElementById('filesInfo'));

            };
        }(file));
        reader.readAsDataURL(file);
    }
    uploadFiles();
} 

```