Quando você usa innerHTML você substitui a cada loop tudo que está dentro da div e coloca o novo conteúdo. Ou seja quando passa pelo primeiro loop ele adicionava o número 1, quando passava pelo segundo loop, ele zera a div e adicionava o 2 e assim por diante, abaixo segue exemplo de como conservar o conteúdo original e adicionar um novo em seguida. Somei com um <br />
para quebrar a linha.