DOM using outerHTML to set class attribute in <td> tag

[onembk]

Hey, I'm a bit of a JavaScript newb and I'm having some difficulty
setting a class attribute on a JavaScript created table cell.

I'm using JavaScript to insert cells in a table with a file input,
similar to the way gmail does file attachments. Here's my functional
code:


<script type="text/javascript">
function addFile(row) {
var x = document.getElementById('upload_form').rows[row];
x.cells[0].innerHTML = '';
a = x.insertCell(1);
a.innerHTML = '<input type="file" name="upload[]" class="textbox" />
(<?php echo parseByteSize($upload_maxsize); ?> max) <a
href="#attachments" onclick="JavaScript:
removeFile(this.parentNode.parentNode.rowIndex);">Remove this file</a>';

row++;
var x = document.getElementById('upload_form').insertRow(row);

var a = x.insertCell(0);
a.class = "adminLeft";

a.innerHTML = '<a name="attachments" href="#attachments"
onclick="JavaScript:
addFile(this.parentNode.parentNode.rowIndex);">Attach another file</a>';
}

var firstRow = false;
function removeFile(row) {
if (firstRow == false) {
firstRow = row;
}
var x = document.getElementById('upload_form').deleteRow(row);
var x = document.getElementById(upload_form').rows[row];
if (row > firstRow) {
x.cells[0].innerHTML = '<a name="attachments" href="#attachments"
onclick="JavaScript:
addFile(this.parentNode.parentNode.rowIndex);">Attach another file</a>';
} else {
x.cells[0].innerHTML = '<a name="attachments" href="#attachments"
onclick="JavaScript:
addFile(this.parentNode.parentNode.rowIndex);">Attach a file</a>';
}
}
</script>
<form action="" method="post" enctype="multipart/form-data">
<input type="hidden" name="MAX_FILE_SIZE" value="<?php echo
$upload_maxsize; ?>" />
<table id="uplolad_form">
<tr>
<td class="adminLeft">
some stuff
</td>
<td class="adminRight">
other stuff
</td>
</tr>
<tr>
<td class="adminLeft" style="width: 15%">
<a name="attachments" href="#attachments" onclick="JavaScript:
addFile(this.parentNode.parentNode.rowIndex);">Attach a file</a>
</td>
</tr>
</table>
</form>


This all works, but I want to set the <td> element so that it's like

<td class="adminLeft">
or
<td class="adminRight">

basically, the CSS just aligns the text right now but other things will
be added later. I tried using outerHTML but I had odd results (the
left cell became blank when adding a new input and the new row wasn't
added). Google isn't being very helpful Any help is greatly
appreciated, thanks.