Armado de columnas dinàmico

[opzina]

Buenas,

Necesito armar divs separando o fragmentando la cantidad de palabras de acuerdo a la altura del contenedor padre. A medida que el contenedor crece se cargan las palabras, una vez que el contenedor hijo tiene la misma altura que el padre se genera un nuevo div.

Esto es lo que tengo, aunque me genera muchos div repetidos:

Código Javascript:

var columns = function(words) {
            var content = trim(i);
            var words = content.split(" ");
            var len = words.length;
            
            var index = 0;
            var info = "";
            var html = "";
            var target = $('#target');
            var targetHeight = target.height();
            var columns = $('.column');
            //var content = columns.children('.box-content');
            var contentHeight = 0;
            var output = $('.column').children('.box-content');
            
            do {
                
                html += '<div class="column">';
                html += '<div class="box-content">';
                html += '</div>';
                html += '</div>';
                target.html(html);
                
                info += words[index] + ' ';
                $('.column').children('.box-content').html(info);
                
                var contentHeight = $('.column').children('.box-content').height();
                
                index++;
                
            } while(contentHeight < targetHeight);
}