jQuery append()?

[opzina]

Código Javascript:

info = $(data).find('content').text();
 
        var output = function(info) { 
            var pagenum = 0;
            var elem = createElement(pagenum); 
            //var data = trim(info);
            var words = info.split(' '); 
            var len = words.length;
            var target = document.getElementById('pages');
 
            for (var i = 0; i < len; i++) 
            { 
                $(elem).append(words[i] + ' '); 
                if (elem.offsetHeight + 20 > target.offsetHeight) { 
                    pagenum++;
                    elem = createElement(pagenum);   
                }
            }
        }
 

El objetivo es cargar contenido dentro de un elemento hijo hasta que el elemento hijo tenga la misma altura que el elemento padre. Si el contenido del elemento hijo supera la altura del elemento padre, creo un nuevo elemento hijo y continuo la carga del contenido en el nuevo elemento y así hasta que no hay más contenido.

Con append logro cargar el contenido del xml con etiquetas html, sin embargo append agrega cada palabra del array una despues de la otra. Ejemplo:

<h1>Este</h1>

es
un
encabezado

y debería ser:

<h1>Este es un encabezado</h1>



Pensé en usar html(), aunque me genera multiples div con el mismo contenido y reemplaza lo agregado antes.