How can I read the content of a file and append it to an string to latter add it into the html?

I'm trying this:

    for (var i = 0; i < nFiles; i++) {
        datos += "<pre>Archivo " + (i+1) +": "+ files[i].name  + "  Tamaño: " + files[i].size +" bytes " + "  Tipo: " + files[i].type + "Última modificación: " + files[i].lastModifiedDate+ "</pre>" ;
        var text = "test";
        if (files[i].type.match(/text.*/)) {
            var lector = new FileReader();
            lector.onload = function (evento) {
                text = lector.result;
          }      
        lector.readAsText(files[i]);
        datos += "<pre>" + text + "</pre>";
        }
        else {
            alert("Error : ¡¡¡ File not valid !!!");
        }
    }

document.getElementById("datos").innerHTML = datos;

But it always writes "test" in the HTML. However, the other properties from the file appear correctly. I'm not sure what I'm doing wrong reading the file