passing variables to .load(html) in jQuery

Question

Say I have jquery code like this:

html += '<div class="index">' + item.index + '</div>';

// many more similar html += statements

// load items
$('div').append(html);

This html is getting too unmanageable, so I'd like to move it to an external file. What's the best way to pass variables to the HTML as i load it? Do i just have to load it and then put jquery commands in the first JS file? That's what it seems like, but I'd rather use a more template-like method.

Answer 1

put HTML where it belongs, in the HTML file. then use a templating plugin on jQuery to expand it.

some template plugins:

• jsRepeater
• jTemplates
• noTemplate