Trik mengolah HTML on-the-fly menggunakan jQuery + JSON

Terkadang kita bingung bagaimana cara terbaik atau yang relevan untuk membuat atau mengolah html dengan menggunakan javascript, terdapat beberapa cara :

————————————————————————————————————————

1. Dengan membuat tag-tag html langsung

$(document).ready(function(){
var list = '';
for (var i=0; i<2; i++) {
list += '<li>'+i+'</li>';
}
});

('#list').html(list);

maka akan menghasilkan :

<ul id="list">
<li>0</li>
<li>1</li>
</ul>

Tetapi bagaimana jika kita bekerja dengan seorang web designer yang tugasnya membuat html + css dan web designer tersebut enggan menyentuh code javascript tersebut, misal code javascript nya sudah terlalu kompleks, juga terkadang kita takut jika ada yang menyentuh code javascript kita. Kemudian hal ini juga menyebabkan code javascript kita terlihat tidak bersih karena bercampur dengan tag-tag html dan bisa membingungkan.