How To Reference A CSS Class With JavaScript

Some of the CSS topics in my help file were not displaying properly due to a problem with background image urls in CSS. This problem only appears in the Help 2.0 version of help collections for the Microsoft Document Explorer. I was unable to find any mention of this problem online because few people are doing anything fancy with Help 2.0.

I had to find a way to reference the div classes using JavaScript so I could set the background images via code. This proved to be tricky so I will share my code below. It has solved most of my problems in my help topics that illustrate CSS techniques:

var divTags = document.getElementsByTagName('div');
for(i = 0; i < divTags.length; i++) { if (divTags[i].className == "sidebox") { divTags[i].style.background = "url(sbbody-r.gif) no-repeat bottom right"; } if (divTags[i].className == "boxhead") { divTags[i].style.background = "url(sbhead-r.gif) no-repeat top right"; } if (divTags[i].className == "boxbody") { divTags[i].style.background = "url(sbbody-l.gif) no-repeat bottom left"; } } document.getElementsByTagName('h2')[0].style.background = "url(sbhead-l.gif) no-repeat top left";