Question

Is it possible to replace a table cell without deleting it with javascript or jQuery? For example, if I have a table with several rows, each row having 5 cells, could I change the first cell of the first row through assignment instead of removing the cell and then inserting a new one?

EDIT (simplified):

<table>
    <tr id="currentRowId1" name="currentRowId1">
        <td style="text-align:center">
        </td>
        <td style="text-align:center">
        </td>
        <td style="text-align:center">
            <input type="submit" onclick="changeOrder()" />
        </td>
        <td style="text-align:center">
        </td>
        <td>
        </td>
    </tr>
    <tr id="currentRowId2" name="currentRowId2">
        <td style="text-align:center">
        </td>
        <td style="text-align:center">
        </td>
        <td style="text-align:center">
            <input type="submit" onclick="changeOrder()" />
        </td>
        <td style="text-align:center">
        </td>
        <td>
        </td>
    </tr>
</table>

js

function changeOrder(){
var row = document.getElementById("currentRowId1");
var otherRow = document.getElementById("currentRowId2");
row.cells[0] = otherRow.cells[0];
}

Answer 1

There is acutally no need to work with innerHTML here. You could replace the two elements like this:

var
  a = document.getElementById('currentRowId1').cells[0],
  e = document.getElementById('currentRowId2').cells[0],
  e1 = e.nextSibling;

a.parentNode.replaceChild(e, a);
e1.parentNode.insertBefore(a, e1);

demo: http://jsfiddle.net/X4zzb/1/