Setting html directly with innerHTML is the fastest way cross-browser. It has some bugs, however, that you should keep in mind (tables, forms, etc.).

var html = []; for (...) { html.push( PARTIAL_HTML ); } element.innerHTML = html.join(""); 

Setting html directly with innerHTML is the fastest way cross-browser. It has some bugs, however, that you should keep in mind (tables, forms, etc.).

var html = []; for (...) { html.push( PARTIAL_HTML ); } element.innerHTML = html.join(""); 

UPDATE: The best way may be to test it for yourself:

function test( name, fn, n, next ) { var n = n || 100; // default number of runs var start, end, elapsed; setTimeout(function() { start = Number(new Date()); for ( ; n--; ) { fn() } end = Number(new Date()); elapsed = end - start; // LOG THE RESULT // can be: $("#debug").html(name + ": " + elapsed + " ms"); console.log(name + ": " + elapsed + " ms")); next && next(); }, 0); } test("dom", function() { // ... }); test("innerHTML", function() { // ... });