Maintanable jQuery inserting of a lot of HTML data

Asked Mar 27 '14 at 11:28

Active Mar 27 '14 at 11:28

Viewed 45 times

Currently, my jquery HTML appending (its in a loop) look like this:

$.each(query,function(i)
{
    var clone = "<li><div id='grid'><img src='"+query[i].co+"'><div id='information'><div id='descr'>"+query[i].co_short+"</div><div id='rat'><a href='"+query[i].core+"'>"+query[i].asc+"</a><a href=''>+</a></div><a href='?action"+query[i].id+"'><div id='title'>"+query[i].desc+"</div><div id='year'>("+query[i].ass+")</div></a></div></div></li>";
    $('#list').append(clone);
});

As you can see, its just a big clunky mess. And im looking for a more elegent and maintable solution, so please share if you have something in mind.

asked Mar 27 '14 at 11:28

aaaaaa4422

Here is a link to the official docs on the subject: http://learn.jquery.com/performance/append-outside-loop/ – CodingIntrigue Mar 27 '14 at 11:40
And then: possible duplicate of [Best way to add DOM elements with jQuery](http://stackoverflow.com/questions/2202269/best-way-to-add-dom-elements-with-jquery) – CodingIntrigue Mar 27 '14 at 11:41
Thanks! Yes, it seems like a duplicate. – aaaaaa4422 Mar 27 '14 at 12:43

Maintanable jQuery inserting of a lot of HTML data

0 Answers0