traer datos poniéndolos en elementos unos detrás de otros

[breaststroke]

Buenas.
Estoy intentando recoger datos con ajax e ir colocándolos dentro de un Div.
Ésta es la parte de la función para ello (se activa con un evento):

Código Javascript:

...
xmlhttp.onreadystatechange=function()
  {
//datos que recogo de un input con id=comment, con un evento
  var element = document.getElementById('comment').value;
   var container = document.getElementById('display');
 //éste es el elemento creado, un p, dentro del div anterior
  var new_element = document.createElement('p');
  new_element.innerHTML =element;
  container.appendChild(new_element, container.firstChild);
  }
...
 

La cuestión es que cuando recogo los datos de un elemento de la página, como en el caso de arriba, me funciona bien.
Pero si los datos los traigo de otra página, me aparecen, pero duplicados. Y el fallo sé que no está en la otra página, puesto que lo he probado con otras funciones (cuando no quiero que los datos aparezcan unos tras otros, sino que se sustituyan).

Es decir, si en lugar de:

Código Javascript:

var element = document.getElementById('comment').value;
 

tengo:

Código Javascript:

var element=xmlhttp.responseText;
...
xmlhttp.open("GET","otrapágina.php?,true);
xmlhttp.send();
...
 

entonces me aparece el problema, de que cada vez que aparecen datos nuevos, salen duplicacados.


¿Alguna idea de qué estoy haciendo mal?
Muchas gracias!