Change class name

JavaScript
1

Hi,

So i like to change class name from a html page with javascript.

I found this code that does change the class name

loopCSSChange = function (el, class, newclass)
{
   for (var x=0;x<el.childNodes.length;x++)
  {
        loopCSSChange(el.childNodes[x], class, newclass);

  }

  if (el.className==class) el.className=newclass;

}

loopCSSChange(document, "oldclass", "newclass");

But the problem is that the page has multiple classes with the same name


<td class="oldclass">...</td>
<td class="oldclass">...</td>
<td class="oldclass">...</td>

Is it possible to change the first class with newclass1, the second one with newclass2, etc…
So that it would look like this:


<td class="newclass1">...</td>
<td class="newclass2">...</td>
<td class="newclass3">...</td>

grtz

2

one option is to use a getElementByClassName function and then loop through the returned element objects and change their className to whatever you need.

 
function getElementsByClassName(oElm, strTagName, strClassName)  {
    var arrElements = (strTagName == "*" && oElm.all)? oElm.all : oElm.getElementsByTagName(strTagName);
    var arrReturnElements = new Array();
    strClassName = strClassName.replace(/\\-/g, "\\\\-");
    var oRegExp = new RegExp("(^|\\\\s)" + strClassName + "([\\\\s|$](file:///s:$))");
    var oElement;
    for(var i=0; i<arrElements.length; i++)
    {
        oElement = arrElements[i];
        if(oRegExp.test(oElement.className))
        {
            arrReturnElements.push(oElement);
        }
    }
    return (arrReturnElements)
}
 
//example usage
 
var divObjs = getElementsByClassName(document,'div','myClass');