Explorer Windows and Safari bug - Removing inline border styles

Setting an inline border style (element.style.border) works in all browsers. Removing it, however, is tricky in Explorer Windows and impossible in Safari.

The test DIV below has a border: 1px dotted #AD007B; defined in the style sheet. When we set its style.border the browser adjusts its inline styles, which overrule the normal style sheet. Therefore the element gets the new border styles (in this example 5px solid #D5DFF5). This works fine in all browsers.

It would seem logical that removing the inline style again (style.border = '') would activate the normal style sheet again, since we remove the overruling rule. However, this is not the case in Explorer Windows and Safari.

Safari flatly refuses to remove the border style. I don't know how to solve this problem.

Explorer Windows removes all border styles (effectively border: none). This can be solved by explicitly removing the three sub-styles, width, style and color:

document.getElementById('test').style.borderWidth = '';
document.getElementById('test').style.borderStyle = '';
document.getElementById('test').style.borderColor = '';

Test