[RESOLVED] Expand collapse tbody not working in IE

[CODE]
function getItem(id)
{
var itm = false;
if(document.getElementById)
itm = document.getElementById(id);
else if(document.all)
itm = document.all[id];
else if(document.layers)
itm = document.layers[id];

return itm;
}

function toggleTable(id)
{
itm = getItem(id);
if(!itm)
return false;
if(itm.style.display == ‘none’){
itm.style.display = ”;
img = getItem(‘showhideimage’);
img.src = “img/collapse.png”;
}else {
itm.style.display = ‘none’;
img = getItem(‘showhideimage’);
img.src = “img/expand.png”;
}
return false;
}
[/CODE]

[code=html]
<table class=”list” cellspacing=”0″ cellpadding=”0″ border=”0″ style=”width: 100%;”>
<thead>
<tr>
<th class=”head” colspan=”4″>
<img id=”showhideimage” onclick=”toggleTable(‘templates’);” alt=”Show/Hide Reports” src=”img/collapse.png”/>
Available Reports
</th>
</tr>
<tr>
<th align=”left”>Report Name</th>
<th align=”left” width=”20%”>Last Changed</th>
<th align=”left” width=”10%”>Options</th>
</tr>
</thead>
<tbody id=”templates” style=””>
<tr class=”odd”>
<td align=”left”> Timesheet</td>
<td align=”left” width=”20%”>2008/09/30 11:30AM</td>
<td align=”center” width=”10%”>
<a href=”#”>
<img onclick=”xajax_generateReport(22);” title=”Generate Report” src=”img/run.png”/>
</a>
</td>
</tr>
</tbody>
</table>
[/code]

This code works fine in FF but in IE it hides the whole table and not just the tbody.

Also in #JavaScript _↴