Javascript style assignment only works in Opera (but not in Firefox or IE8)

Question

The following javascript code works perfectly in Opera(v10.5x), but fails miserably in Firefox(v3.6) and IE8.

function HighlightBox(elementid,highlight)
{
      var hstyle="none";

      if (highlight)
        {        
        switch (elementid) 
        {
              case 'emailbox':
              case 'lastnamebox':
              case 'firstnamebox':
              case 'campusbox':                         
                hstyle="width:275px;height:70px;border:2px solid red;";                                                         
                break;
              case 'isdbox':
                hstyle="width:275px;height:100px;border:2px solid red;";
                break;
        }
        }

    document.getElementById(elementid).style = hstyle;  
}

I have tried individual assignments like:

document.getElementById(elementid).style.width="275px";
...

But these don't seem to work either.

I appreciate any assistance in this matter. Thank you, Ai Pragma

Answer 1

For that purpose you can try to use the cssText property, is widely supported:

document.getElementById(elementid).style.cssText = "width:275px;height:100px;border:2px solid red;"

Check the above example here.