JavaScript: Aggiungi a più classi - javascript, html

Come puoi aggiungere contenuti a più classi utilizzando JavaScript?

Questo è ciò su cui sto lavorando:

<div class="element">
<p>Existing Content</p>
<p>Existing Content</p>
</div>

<div class="element">
<p>Existing Content</p>
<p>Existing Content</p>
</div>

Dopo l'esecuzione della funzione, il risultato dovrebbe essere il seguente:

<div class="element">
<p>Existing Content</p>
<p>Existing Content</p>
<p>Added Content</p>
</div>

<div class="element">
<p>Existing Content</p>
<p>Existing Content</p>
<p>Added Content</p>
</div>

Questa è la mia funzione finora (non funzionante però):

var element = document.querySelectorAll(".element");

for (i = 0; i < element.length; ++i) {
element[i].innerHTML = element.innerHTML + "<p>Added Content</p>";
}

No jQuery per favore :)

risposte:

Ti manca l'indice dell'array [i] nel tuo innerHTML Incarico. Invece di...

element[i].innerHTML = element.innerHTML + "<p>Added Content</p>";

...dovresti usare:

element[i].innerHTML = element[i].innerHTML + "<p>Added Content</p>";