Estoy tratando de comprender los conceptos básicos para tener bases sólidas.

De momento estoy realizando un ejercicio para la recuperación de unos tweets ficticios. Estoy haciendo un esfuerzo por entender bien el por qué de todo el desarrollo del bucle y me queda algo sin entender.

Pongo aquí el código inicial, el funcional:

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

    var tweets = ["Hi", "Bye", "See You"]

    var dailyTweets = "";

    for (var i = 0; i < tweets.length; i++) {

      dailyTweets = dailyTweets + "<p>" + tweets[i] + "</p>";
      
    }
      
      document.getElementById("tweet").innerHTML = dailyTweets;
        
      console.log(dailyTweets); 

<!-- language: lang-html -->

    <div id = "tweet"></div>

<!-- end snippet -->

 
Analizando el código me dije: Me parece que a  la línea `dailyTweets = dailyTweets + "<p>" + tweets[i] + "</p>";` pudiese ser `dailyTweets = "<p>" + tweets[i] + "</p>";` y aún funcionar, incluso mejor porque sería más conciso. El resultado es el siguiente:

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

    var tweets = ["Hi", "Bye", "See You"]

    var dailyTweets = "";

    for (var i = 0; i < tweets.length; i++) {

      dailyTweets = "<p>" + tweets[i] + "</p>";
      
    }
      
      document.getElementById("tweet").innerHTML = dailyTweets;
        
      console.log(dailyTweets);    

<!-- language: lang-html -->

    <div id = "tweet"></div>

<!-- end snippet -->

Este código no dio resultado, ya que la salida esperada es cada tweet por separado y en secuencia, como en el primer ejemplo.

Mi duda es: ¿Por qué debo colocar la variable debe ser igual a la variable más el índice del array para que funcione; ej. `var = var + "<p> array[i] </p>"`?

Por qué este sí: `dailyTweets = dailyTweets + "<p>" + tweets[i] + "</p>";`

y

Este no: `dailyTweets = "<p>" + tweets[i] + "</p>";`