CSS gradient filter Javascript and IE 9

Question

problem: IE9

I have a table. And i have a CSS class. The CSS class contains a gradient filter:

.red
{
    filter:progid:DXImageTransform.Microsoft.Gradient(sProperties);
}

if i do:

... <tr class="red"> ...

everthing works fine. If i do

<script type="javascript">

... element.className = 'red';

</script>

the filter doesnt apply. does anybody knows what event could be fired after assignment to apply? Doing td class="red" is no solution, the table is rendered with a powershell table helper. jQuery or other frameworks are also no solution, it would blow up this simple "one page" application. Thanks in advance, Robert

Edit:

http://msdn.microsoft.com/en-us/library/ms532997(v=vs.85).aspx

object.style.filter =  "progid:DXImageTransform.Microsoft.Gradient(sProperties)"

Answer 1

Assuming element actually refers to the element you want to make red, and that the script calling it is called after element actually exists on the page, and that your CSS includes actual arguments to Gradient and not just the literal sProperties , then try zooming the page in and out to manually force a redraw. Assuming the gradient suddenly appears, try toggling the display of the element to hide and then show it again, thus forcing an automatic redraw.

Actually, that's a lot of assumptions... Maybe you should just use a background-image instead?