No puede usar la misma variable para diferentes propósitos al mismo tiempo. Primero asignas un elemento DOM a result , e inmediatamente en la siguiente línea sobrescribes result con una string .

Cree una cadena htmlStr dentro de su bucle y, cuando termine, asigne esta cadena a la propiedad result.innerHTML :

 function start() { let arr = [], result, htmlStr = ''; result = document.getElementById("arraying"); htmlStr += "<p>"; for (let i = 0; i < 5; i++) { arr[i] = Math.floor(Math.random() * 10); htmlStr += "arr[" + i + "]= " + arr[i] + "</p><p>"; } htmlStr += "</p>"; result.innerHTML = htmlStr; } window.addEventListener("load", start, false);

 <div id="arraying"></div>

Mirando el código, parece que te faltan algunos conceptos básicos de javascript.

tamaño de matriz

Este es probablemente su principal problema:

 var arr(5)

Esto no tiene sentido en javascript. No es necesario predefinir la longitud de la matriz, ya que todas las matrices tienen una longitud dinámica. Simplemente defina una matriz como esta:

 var arr = []

Luego, más tarde, cuando desee agregar nuevos elementos, use push como este:

 arr.push( Math.floor(Math.random()*10) )

agregando html usando innerHTML

Hay diferentes formas de inyectar html dinámicamente en su página. (Parece que) intentó agregar el html como una cadena al elemento principal. Esto no es posible.

Dijiste que intentaste usar innerHTML . Eso debería funcionar si se usa correctamente.

Una implementación funcional funcionaría así:

 function start() { var arr = [] var result = "<p>" for(var i = 0; i < 5; i++) { arr.push( Math.floor(Math.random()*10) ) // Btw this array isn't actually needed. result += "arr[" + i + "] = " + arr[i] + "</p><p>" } document.getElementById("arraying").innerHTML = result } window.addEventListener("load", start, {passive: true});

agregando html usando createElement

En general, una mejor manera de agregar dinámicamente elementos html es a través createElement .

De esta manera, no tiene que escribir html y, por lo tanto, es menos propenso a cometer errores. También es más eficaz y más fácil de integrar en javascript.

Creo que la mejor explicación es una implementación comentada:

 function start() { var myDiv = document.getElementById("arraying") // get parent node var arr = [] for(var i = 0; i < 5; i++) { arr.push( Math.floor(Math.random()*10) ) var p = document.createElement("p") // create p element p.innerText = "arr[" + i + "] = " + arr[i] // add text content to p element myDiv.append(p) // append p element to parent element } } window.addEventListener("load", start, {passive: true});

pequeños consejos

La palabra clave let funciona casi igual que la palabra clave var , pero generalmente se prefiere debido a algunos casos extremos en los que let es superior.

La fusión de cadenas y variables mediante el operador más generalmente se considera una mala práctica. Una mejor manera de hacer la concatenación de cadenas habría sido

 result += `arr[${i}] = ${arr[i]}</p><p>`