Topic awaiting preservation: Catching onClick event. (Page 1 of 1)

Hi,
I have a table which each one of the header column implements onClick method.
I want to add dynamically SPAN that will implement different onClick method.
Example:
<table>
<tr id=?tableRow?>
<td onClick=?doSort(event)?>bla bla 1</td>
<td onClick=?doSort(event)?>bla bla 2</td>
</tr>
.....
</table>

My Javascript code is the following:
var cells = document.getElementById(?tableRow?).cells;
for(var y=0; y < cells.length; y++){
var oCell = cells[y];
var oFilterSpan = document.createElement("SPAN");
oFilterSpan.onClick = FilterTableCell;
oFilterSpan.appendChild(document.createTextNode(" [F]"));
oCell.appendChild(oFilterSpan);
}

The FilterTableCell was never called.

10x in advanced
Yossi Admon

Try setting the onClick event after you attach the SPAN to the document.

Either by setting a unique ID for each span and referenceing the newly created element through document.getElementById() or by setting a class name for the spans then using something like :: spanArray = getElementsByTagName("span") :: where spanArray[x].className = "filterClass" :: add the onClick event then.

I?ve tried it and it?s not working.

I've resolved it by the following way:

var oFilterSpan = document.createElement("SPAN");
oFilterSpan.appendChild(document.createTextNode(" [F]"));
oFilterSpan.id = "filter_span" + y + j;
oCell.appendChild(oFilterSpan);
var oSpan = document.getElementById("filter_span" + y + j);
// Add the hookup for the onClick event.
if(typeof oSpan.addEventListener != "undefined"){
oSpan.addEventListener("click", FilterTableCell, false);
} else if(typeof oSpan.attachEvent != "undefined"){
oSpan.attachEvent("onclick", FilterTableCell);
} else {
oSpan.onclick = FilterTableCell;
}