Internet Explorer 7 css js表列显示错误

有一个奇怪的错误我解决不了。

通过这个简化的例子可以重现这个错误:

css格式:

table.class1 td.subclass1{ display : none }
table.class2 td.subclass2{ display : none }

html格式:

<table class="class1">
 <tr>
  <td class="subclass1"> Invisible </td>
  <td class="subclass2"> Visible </td>
 </tr>
</table>

js(jQuery)

$("table.class1").removeClass("class1").addClass("class2);

如您所见,Internet Explorer 7没有显示“可见”列:

Fiddle Demo

我要怎么做才能从一列切换到另一列?

不幸的是,我不能改变HTML,但只有CSS和JS。