The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript jquery append empty divs vs. html markup Re: jquery append empty divs vs. html markup


You want to minimize the amount of appending you do. If you use append() you’re better off making a single string with both DIVs in it and appending that in one go.

var emptyArray = ;
var len = emptyArray.length;
var strDivs = '';
for(i=0i strDivs = strDivs + '

What’s even faster than that is making an array and using the native javascript .join() method to turn that array into a string after the loop.

In terms of using html() vs append(), it depends on your project really. Your markup and images should load before any jquery runs as you should wrap it in $(document).ready(function() {}); anyway.

If you know you’re definately going to populate all the DIVs, I’d put them in the markup and use html() later.
Unless you’re talking thousands of them… in which case I’d let JS do it on the client to keep page load speeds down.

Try both ways and do some speed tests.