Javascript class modification

I’m creating an active ajax interface where on one side the user will select the category and then on the other side that categories contents will show. Currently I have it set so the categories bkg color changes on hover and once it is selected via javascript in the ajax script below. My question is that once it is selected it stays selected; how do I have one of the categories clear it’s class when another category is selected. Script and example image are below

[CODE]function populatestudents(class)
{
var urlstd = “/phpscripts/rsrch_students.php?param=”;
http.open(“GET”, urlstd + escape(class), true);
document.getElementById(class).setAttribute(“class”, “active”);
document.getElementById(“studentresult”).innerHTML=”<img src=’/images/ajax-loader.gif’ style=’margin:50px 0 0 150px;’/>”;
http.onreadystatechange = handleHttpResponseStdLdSTU;
http.send(null);
}

function handleHttpResponseStdLdSTU()
{
if (http.readyState == 4)
{
resultsuserSTU = http.responseText;
/* On php script completion print script result in response div */
if(resultsuserSTU == “”) resultsuserSTU = “”;
document.getElementById(‘studentresult’).innerHTML = resultsuserSTU;
// evaluate javascript
scriptTag='(<script.*?>)((n|r|.)*?)(</script>)’;
if (scripts=resultsuserSTU.match(scriptTag)) {
// remove slashes
scripts[2]=scripts[2].replace(/\/g,””);
//run scripts
eval(scripts[2]);
}
}
}

function getHTTPObjectStdLdSTU()
{
var xmlhttpSTU;
if (!xmlhttpSTU && typeof XMLHttpRequest != ‘undefined’)
{
try {xmlhttpSTU = new XMLHttpRequest();} catch (e) {xmlhttpSTU = false;}
}

//KILL HERE
//END KILL
return xmlhttpSTU;
}
var http = getHTTPObjectStdLdSTU();[/CODE]

example image:[url]http://fitness.recorded-live.com/images/ex.jpg[/url]

Also in #JavaScript _↴