Use the DOM or SPAN ID to insert <TR> below another

I have the following code and I need to insert a row dynamically below the row where there is a "Home Number:" as innerText in that row.  You can use the DOM to loop through or the span tag, but I just don't know how to do either.
<html>
<script>
 
sTR = document.getElementsByTagName("TR");
for(i=0;i<sTR.length;i++) {
	// if the row has "Home Number:" then add a row below it
}
</script>
 
<body>
 
<form>
 
<TABLE CLASS=CONTENT WIDTH=100%>
<TR><TD COLSPAN=10></TD></TR>
<TR></TR>
<TR>
<TD VALIGN=TOP >
	<SPAN ID=_Captlead_personlastname class=VIEWBOXCAPTION>Last name:</SPAN><br>
	<SPAN ID=_Datalead_personlastname class=VIEWBOX STYLE=WIDTH:"100px">asdf</SPAN></TD>
	<input type=hidden name=_HIDDENlead_personlastname value="asdf">
<TD  VALIGN=TOP >
	<SPAN ID=_Captlead_personfirstname class=VIEWBOXCAPTION>First name:</SPAN><br>
	<SPAN ID=_Datalead_personfirstname class=VIEWBOX STYLE=WIDTH:"100px">asdf</SPAN></TD>
	<input type=hidden name=_HIDDENlead_personfirstname value="asdf">
<TD  VALIGN=TOP >
	<SPAN ID=_Captlead_personsalutation class=VIEWBOXCAPTION>Salutation:</SPAN><br>
	<SPAN ID=_Datalead_personsalutation class=VIEWBOX STYLE=WIDTH:"100px">&nbsp;</SPAN></TD>
	<input type=hidden name=_HIDDENlead_personsalutation value="">
<TD  VALIGN=TOP >
	<SPAN ID=_Captlead_persontitle class=VIEWBOXCAPTION>Title:</SPAN><br>
	<SPAN ID=_Datalead_persontitle class=VIEWBOX STYLE=WIDTH:"100px">&nbsp;</SPAN></TD>
	<input type=hidden name=_HIDDENlead_persontitle value="">
</TR>
<TR>
<TD  VALIGN=TOP >
	<SPAN ID=_Captlead_personemail class=VIEWBOXCAPTION>E-mail:</SPAN><br>
	<SPAN ID=_Datalead_personemail class=VIEWBOX STYLE=WIDTH:"100px">asdf</SPAN></TD>
	<input type=hidden name=_HIDDENlead_personemail value="asdf">
<TD  VALIGN=TOP >
	<SPAN ID=_Captlead_personphonenumber class=VIEWBOXCAPTION>Phone Number:</SPAN><br>
	<SPAN ID=_Datalead_personphonenumber class=VIEWBOX STYLE=WIDTH:"100px">&nbsp;</SPAN></TD>
	<input type=hidden name=_HIDDENlead_personphonenumber value="">
<TD  VALIGN=TOP >
	<SPAN ID=_Captlead_personfaxnumber class=VIEWBOXCAPTION>Home Number:</SPAN><br>
	<SPAN ID=_Datalead_personfaxnumber class=VIEWBOX STYLE=WIDTH:"100px">&nbsp;</SPAN></TD>
	<input type=hidden name=_HIDDENlead_personfaxnumber value="">
</TR>
</TABLE></TD>
 
<TD WIDTH=1px CLASS=TABLEBORDERRIGHT></TD></TR>
 
<TR HEIGHT=1><TD COLSPAN=3 WIDTH=1px CLASS=TABLEBORDERBOTTOM></TD></TR>
</TABLE>
 
</form>
</body>
</html>

Open in new window

saturationAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Lolly-InkCommented:
This works in IE7 and FF3:
<html>
<script>
   function doIt()
   {
      sTR = document.getElementsByTagName("TR");
      for (i = 0; i < sTR.length; i++) 
      {
         if (sTR[i].innerHTML.search("Home Number:") != -1)
         {
            var tr = document.createElement("tr");
            var td = document.createElement("td");
            td.innerHTML = "Inserted Row";
            tr.appendChild(td);
            if (sTR[i].nextSibling)
            {
               sTR[i].parentNode.insertBefore(tr, sTR[i].nextSibling);
            }
            else
            {
               sTR[i].parentNode.appendChild(tr);
            }
         }
      }
   }
</script>
<body onload="doIt()">
<form>
<TABLE CLASS=CONTENT WIDTH=100%>
<TR><TD COLSPAN=10></TD></TR>
<TR></TR>
<TR>
<TD VALIGN=TOP >
	<SPAN ID=_Captlead_personlastname class=VIEWBOXCAPTION>Last name:</SPAN><br>
	<SPAN ID=_Datalead_personlastname class=VIEWBOX STYLE=WIDTH:"100px">asdf</SPAN></TD>
	<input type=hidden name=_HIDDENlead_personlastname value="asdf">
<TD  VALIGN=TOP >
	<SPAN ID=_Captlead_personfirstname class=VIEWBOXCAPTION>First name:</SPAN><br>
	<SPAN ID=_Datalead_personfirstname class=VIEWBOX STYLE=WIDTH:"100px">asdf</SPAN></TD>
	<input type=hidden name=_HIDDENlead_personfirstname value="asdf">
<TD  VALIGN=TOP >
	<SPAN ID=_Captlead_personsalutation class=VIEWBOXCAPTION>Salutation:</SPAN><br>
	<SPAN ID=_Datalead_personsalutation class=VIEWBOX STYLE=WIDTH:"100px">&nbsp;</SPAN></TD>
	<input type=hidden name=_HIDDENlead_personsalutation value="">
<TD  VALIGN=TOP >
	<SPAN ID=_Captlead_persontitle class=VIEWBOXCAPTION>Title:</SPAN><br>
	<SPAN ID=_Datalead_persontitle class=VIEWBOX STYLE=WIDTH:"100px">&nbsp;</SPAN></TD>
	<input type=hidden name=_HIDDENlead_persontitle value="">
</TR>
<TR>
<TD  VALIGN=TOP >
	<SPAN ID=_Captlead_personemail class=VIEWBOXCAPTION>E-mail:</SPAN><br>
	<SPAN ID=_Datalead_personemail class=VIEWBOX STYLE=WIDTH:"100px">asdf</SPAN></TD>
	<input type=hidden name=_HIDDENlead_personemail value="asdf">
<TD  VALIGN=TOP >
	<SPAN ID=_Captlead_personphonenumber class=VIEWBOXCAPTION>Phone Number:</SPAN><br>
	<SPAN ID=_Datalead_personphonenumber class=VIEWBOX STYLE=WIDTH:"100px">&nbsp;</SPAN></TD>
	<input type=hidden name=_HIDDENlead_personphonenumber value="">
<TD  VALIGN=TOP >
	<SPAN ID=_Captlead_personfaxnumber class=VIEWBOXCAPTION>Home Number:</SPAN><br>
	<SPAN ID=_Datalead_personfaxnumber class=VIEWBOX STYLE=WIDTH:"100px">&nbsp;</SPAN></TD>
	<input type=hidden name=_HIDDENlead_personfaxnumber value="">
</TR>
</TABLE></TD>
 
<TD WIDTH=1px CLASS=TABLEBORDERRIGHT></TD></TR>
 
<TR HEIGHT=1><TD COLSPAN=3 WIDTH=1px CLASS=TABLEBORDERBOTTOM></TD></TR>
</TABLE>
 
</form>
</body>
</html>

Open in new window

0
saturationAuthor Commented:
Ok, that works, and I'll definitely award points, but it turns out I absolutely need to look for the span id=_Captlead_personphonenumber, find that row, then insert a row after it rather than looping through the DOM and <TR> tags.  Are you able to help me do this?
0
scrathcyboyCommented:
after the TD ID tage you are looking for, put this --

<SPAN id="2"> <TR> <TD id="2"> </TD> </TR> </SPAN>

put that in the page code at the outset, then reference the SPAN or TD by id=2 to add the text you want.
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Web Languages and Standards

From novice to tech pro — start learning today.