Im making a skin that has the main title split up into 3 different sections. Situation: Maintitle is split. Theres an image that always appears at the left and another one that always appears at the right. And then maintitle has a background image that connects the other 2 images so it will work on all screen resolutions. Code: .maintitle { vertical-align:middle; font-weight:bold; color:#333333; background-image: url("http://skullmonkey.net/images/forum/coltb/mainback.gif"); } .mainleft { background: url([url]http://skullmonkey.net/images/forum/coltb/mainbeg.gif[/url]) bottom left no-repeat; /*width:59px;*/ } .mainright { background: url([url]http://skullmonkey.net/images/forum/coltb/mainend.gif[/url]) bottom right no-repeat; /*float:right; width:259px;*/ } .mainspacing { padding:9px 2px 8px 20px; } Now i am doing this with JS that my friend made for me (but is on vacation now). Code: <script type='text/javascript'> <!-- e = document.getElementsByTagName('DIV') dv = [] i = 0 for (n = 0; n < e.length; n++) if (e[n].className == 'maintitle' && e[n].parentNode.id != 'ucpmenu') dv[i++] = e[n] for (n = 0; n < i; n++) { s = dv[n].innerHTML dv[n].innerHTML = "<div class='mainleft'><div class='mainright'><div class='mainspacing'>" + s + '</div></div></div></div>' } // --> </script> Does anyone know how to change the code so that i can do the same thing with .darkrow2 and another item that is different (#submenu (doing something different))?