I need to apply a CSS class to a link on the fly.

I wrote a function:

Code:
function f(variabl)
{
  var i, lnk;

  for(i=0; (lnk = document.getElementsByTagName("a")[i]); i++)
  {
  if(lnk.getAttribute("name").indexOf("xy") != -1)
	{
       if(lnk.getAttribute("name").indexOf(variabl) != -1)
		{
		lnk.setAttribute("class","className");
		result = lnk.getAttribute("class");
		alert(result);break;
		}
	}
  }
}
What I do is probe a bunch of links, "xy" is a string appearing in the names of the link 'family' I'm interested in (it could be "id" instead of "name");

"variabl" is a unique string contained in the name of the one link I want to manipulate.

Once I have the right link I apply the class (named "className" in this example).

"result" and "alert" are to check that it works, and it does: alert() gives me the name of the class I applied.

But the link doesn't care, and stays the same except in Netscape6 and Opera7 (PC).

I've tried with "document.links", same problem.

So if anyone knows what could be going on here I'd really appreciate.

PS: There's another way of doing this:

Code:
function f(variabl)
{
  var i, lnk;

  for(i=0; (lnk = document.getElementsByTagName("a")[i]); i++)
  {
  if(lnk.name.indexOf("xy") != -1)
	{
	if(lnk.getAttribute("name").indexOf(variabl) != -1)
		{
		l = lnk.style;
		l.backgroundColor="#fff";
		l.color="#333";
/* etc etc etc etc etc etc etc etc etc: the rest of the rules */
		break;
		}
	}
  }
}
but when the class has many rules it seems silly and unelegant to do it this way. Plus I'd really like to know what's happening here

Thanks for your help