innerHTML elementos en el lugar equivocado

Mi comprensión de innerHTML no está completamente clara, así que estoy teniendo algunos problemas.

Esto produce todos mis td's fuera de la mesa. ¿Qué estoy haciendo mal

var list = document.getElementById("procTable");
list.innerHTML = "<table style='border:gray solid 1px;'><tr>";
for (var i = 0; i < result.d.ProcessDataColumnModel.length; i++) {
    list.innerHTML += "<td style='border:gray solid 1px' width='" + (result.d.ProcessDataColumnModel[i].Width) + "'>" + (result.d.ProcessDataColumnModel[i].Caption);
}

Respuestas a la pregunta(4)

Su respuesta a la pregunta