I am trying to append data to a table based on the ajax returned data. My codes work but it seems ugly. I was wondering if anyone here can help me to simplfy it. Thanks a lot!    ajax.callback=function(data){          for (var i=0; i<dataObj[0].data.length; i++){              var td=document.createElement('td');              td.innerHTML=dataObj[0].data[i].ID;              var td2=document.createElement('td');              td2.innerHTML=dataObj[0].data[i].test;              var td3=document.createElement('td');              td3.innerHTML=dataObj[0].data[i].year;              var td4=document.createElement('td');              td4.innerHTML=dataObj[0].data[i].code;              var td5=document.createElement('td');              td5.innerHTML=dataObj[0].data[i].Label;              var td6=document.createElement('td');              td6.innerHTML=dataObj[0].data[i].contents;              var td7=document.createElement('td');              td7.innerHTML=dataObj[0].data[i].test;              var tr=document.createElement('tr');              tr.appendChild(td);              tr.appendChild(td2);              tr.appendChild(td3);              tr.appendChild(td4);              tr.appendChild(td5);              tr.appendChild(td6);              tr.appendChild(td7);              $('#Table').append(tr);           }    }
How to append ajax return data to a table
javascript;jquery;ajax
You could do:ajax.callback=function(data){    var elements = [ID, test, year, code, Label, contents, test];    for (var i=0; i<dataObj[0].data.length; i++){        var td;        var tr=document.createElement('tr');        for (var j=0; j < elements.length; ++j){            td = document.createElement('td');            td.innerHTML=dataObj[0].data[i][elements[j]];            tr.appendChild(td);        }        $('#Table').append(tr);    }}