getElementById for dynamically created elements

[dirku]

Hi.

I am using JavaScript to dynamically create a table with a number of <TD> depending on the user who logged on (some want to see three values and others want to see five values...):


[blue]

<SCRIPT language="JavaScript1.2">
            document.write('<table class="clocks" border="1" bordercolor="#11fff1" width="100%" cellspacing="0" cellpadding="0" height="35">');
            document.write('<tr>');
             for(x=0; x<numOfTimezones; x++)
            {
                document.write('<td ID="Clock"' + x + ' valign="top" align="center" style="font-family: Verdana, Tahoma, Arial; font-size: 10px; padding-top: 2px;" >Clock' + x + '</td>');
            }//end for x
            document.write('<(tr>');
            document.write('</table>');
</SCRIPT>

[/blue]

To fill the variable number of <TD>s I am using some JavaScript functions. Of course, this should happen in a for-loop. In this loop I want to use a code like this to get the element and then put a value into the <TD>:


[blue]

for(x=0; x<numOfTimezones; x++)
{
    document.getElementById('Clock'+x).innerHTML =
              '<font color="' + ct[x].cl + '">' + ct[x].tz + ClockString(ct[x].ct) + '</font>' ;
            }//end for x

[/blue]

What can I do to access thes elements using JavaScript?

Thank you,

Dirk

 

[mwolf00]

Add an ID to the row holding them

<SCRIPT language="JavaScript1.2">
            document.write('<table class="clocks" border="1" bordercolor="#11fff1" width="100%" cellspacing="0" cellpadding="0" height="35">');
            document.write('<tr [b]ID="clockRow"[/b]>');
             for(x=0; x<numOfTimezones; x++)
            {
                document.write('<td ID="Clock"' + x + ' valign="top" align="center" style="font-family: Verdana, Tahoma, Arial; font-size: 10px; padding-top: 2px;" >Clock' + x + '</td>');
            }//end for x
            document.write('<(tr>');
            document.write('</table>');
</SCRIPT>

Now access them like this...

theRow = document.getElementbyId("clockRow")
for(x=0; x<theRow.childNodes.length; x++){
  alert(theRow.childNodes[x].id + " is the name of the clock")
}

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

 

[dirku]

Thank you, mwolf00.

I made two mistakes:
1. When I was writing the ID in the TD the variable is concatenated after the double quotes of Clock, so the ID for every TD created will still be Clock.
Example: Original: document.write('<td ID="Clock"' + x + ' valign="top".....
I changed it to document.write('<td ID="Clock' + x + '" valign="top"......
This gives me Ids of Clock0, Clock1, etc.

2. I have a lone parenthisis in this line: document.write('<(tr>'); So the TR wasn't closed.