Hello all. I really need help getting this project done. I am just about finished, but I can't get the color changes to happen according to what is in the "status" field of the .XML file. I know that this will only work in IE and yes, it is for internal use only. Any help would be greatly appreciated.
HTML code follows. Notice the javascript that is trying to handle the color change which is
Code:
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>ABC Book Store</title>
<style type="text/css">
<!--
.style1 {
	 font-size: 10pt;
}
-->
</style>
<script type="text/javascript">
function fixStatus( )
{
    var rows = document.getElementsByTagName("tr");
    for ( var r = 0; r < spans.length; ++r )
    {
        var row = rows[r];
        var spans = row.getElementsByTagName("span");
        for ( var s = 0; s < spans.length; ++s )
        {
            var span = spans[s];
            if ( span.datafld != null && span.datafld == "status" )
            {
                var val = span.innerHTML.toUpperCase();
		switch ( val )
                {
                    case 'IS': 
                        row.style.color = "blue"; 
                        break;
                    case 'OO':
                        row.style.color = "pink";
                        break;
                    case 'OS':
                        row.style.color = "orange";
                        break;
		    case 'PO':
                        row.style.color = "green";
                        break;
                    default:
                        row.style.color = "white"; // ?? unknown status ??
                        break;
                } // end of switch
                break; // out of for loop on spans
            } // end of if-status-span found
        } // end of spans loop
    } // end of rows loop
}
window.onload = fixStatus;
</script>
</head>
<script>
function ld_fiction()
{
var doc=nb_fiction.XMLDocument;
doc.load("fiction.xml");
document.getElementById("head_id").innerHTML="Fiction "; 
 
}
function Id_nfiction()
{
var doc_s=nb_nfiction.XMLDocument;
doc_s.load("nfiction.xml");
document.getElementByID("head_id_d").innerHTML="NonFiction";
}

function ID_selfhelp()
{
var doc_t=nb_selfhelp.XMLDocument;
doc_t.load("selfhelp.xml");
document.getElementByID("head_id_e").innerHTML="SelfHelp";
}

function ID_reference()
{
var doc_u=nb_ref.XMLDocument;
doc_u.load("ref.xml");
document.getElementByID("head_id_f").innerHTML="Reference";
}

function ID_mags()
{
var doc_v=nb_mags.XMLDocument;
doc_v.load("mags.xml");
document.getElementByID("head_id_g").innerHTML="Mags";
}




</script>

<XML id="nb_fiction" src="fiction.xml"></XML>
<XML id="nb_nfiction" src="nfiction.xml"></XML>
<XML id="nb_selfhelp" src="selfhelp.xml"></XML>
<XML id="nb_ref" src="ref.xml"></XML>
<XML id="nb_mags" src="mags.xml"></XML>



<object id="nb_fiction" CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" 
width="0" height="0"></object>

<object id="nb_nfiction" CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" 
width="0" height="0"></object>

<object id="nb_selfhelp" CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" 
width="0" height="0"></object>

<object id="nb_ref" CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" 
width="0" height="0"></object>

<object id="nb_mags" CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" 
width="0" height="0"></object>

<body>
<table width="30%" border="0" align="left" cellspacing="1" font size="10">


<tr bgcolor="#CCCCCC">
<td colspan="2">
<table id="FICTIONTABLE" table width="100%"  datasrc="#nb_fiction" font size="1" border="0" align="center" bordercolor="#FFFFFF">
<caption>
<span>Fiction        </span>
</caption>
<thead>
<tr>
<th span class="style1">Stock No.</th></span>
<th span class="style1">Title</th></span>
<th span class="style1">Author</th></span>
<th span class="style1">Status</th></span>
<th span class="style1">Price</th></span>
<th span class="style1">Publisher</th></span>
<th span class="style1">Year of Release</th></span>
</tr>
</thead>
<tbody>
<tr>
<td><span class="style1" datafld="stock"></td></span>
<td><span class="style1" datafld="title"></td></span>
<td><span class="style1" datafld="author"></td></td></span>
<td><span class="style1" datafld="status"></td></span>
<td><span class="style1" datafld="price"></td></span>
<td><span class="style1" datafld="publisher"></td></span>
<td><span class="style1" datafld="year"></td></span>
</tr>
</tbody>
</table>
</td>
</tr>
</body>
</html>
I only included the first part of the html code along with the first table, but there is a table for each xml file that it pulls in to make a XML island.
And, I'm sure that you can tell how the XML file is built from the table.
The tables display beautifully with no problems, but for example, if I have a "IS" in the status spot, which means, "In-Stock", I want the row to be blue. I don't think I'm very far off, but I need an expert to point me in the right direction. Thanks so much in advanced.