Why doesn't this fadeOut() work in Internet Explorer?

Tested on IE7, IE8, IE9... and the fadeOut() is not applied :

<table>
    <tr class="sideOn hidden">
        <td class="trackBotton">
            <input type="submit" value="Remove" onClick="remSide(this);return false" />
        </td>        
    </tr>
</table>

function remSide(param) {
    开发者_C百科$(param).parents('.sideOn').fadeOut(500, function() {
           $(this).remove();
    });
}

Why is this and how can I fix this problem?

Also removing the remove() doesn't work:

function remSide(param) {
    $(param).parents('.sideOn').fadeOut(500);
}

---

JQuery uses filters to do the fading in Internet Explorer, and filters only apply to elements that has layout.

You can give the table row layout like this:

.sideOn { position: absolute; }

Then the elements fade in Internet Explorer, but changing the position style of a table row is not recommended, so you should use some other element for what you want to fade.

---

Guffa had it right with his answer - so I'd like to offer an alternative (workaround for IE, that is):

function remSide(param) {
    $(param).parents('.sideOn').find('td').fadeOut(500, function() {
           $(this).parent().remove();
    });
}

This fades out all the <td>s, then removes the <tr> itself. Seems to work fine in IE8.

Demo: http://jsfiddle.net/B7ndq/3/