Problema al escribir div con document.write y innerHTML

[nightramm]

Hola a todos, tengo el siguiente codigo:

Código:

<div>
<script type="text/javascript"> 
function generarLista(inicio,fin){
for(i=inicio; i<fin; i++){ 
document.write('<div>var'+i+'</div>');
} 
}
generarLista(1,6);
</script> 
</div>        
<div onclick="generarLista(6,11);"><button>GENERAR</button></div>

Esto lo que haces es imprimir lo siguiente:
var1
var2
var3
var4
var5

El problema que tengo es que al presionar el boton para generar del 6 al 10, se me borra todo el contenido de mi sitio quedando solo en pantalla la impresion de lo nuevo o sea:
var6
var7
var8
var9
var10

Probe tambien con innerHTML de la siguiente forma y funciona lo de que al presionar no borre el sitio pero me imprime solo el ultimo resultado:

Código:

<div id="midiv">
<script type="text/javascript"> 
function generarLista(inicio,fin){
for(i=inicio; i<fin; i++){ 
document.getElementById("midiv").innerHTML='<div>var'+i+'</div>';
} 
}
generarLista(1,6);
</script> 
</div>        
<div onclick="generarLista(6,11);"><button>GENERAR</button></div>

En este caso al principio solo muestra var5 y al presionar var10. Asumiendo que el innerHTML es el que funciona de que forma puedo hacer que se generen todos los div del for ?¿

Saludos y gracias

[Fuzzylog]

document.getElementById("midiv").innerHTML='<div>v ar'+i+'</div>';

Aqui estás cogiendo midiv y le estás cambiando el contenido

Lo que tienes que hacer es crear un nuevo div, asignarle el innerHTML que quieres y añadirlo con appendChild a tu document.getElementById("midiv").