Show Hide Element Problem

i am are trying to do something that can be achieved with Javascript.

<script language="javascript">
function showHideComment(onOff){
if (onOff == 1){
document.getElementById('commentArea').style.display = "";
} else {
document.getElementById('commentArea').style.display = "none";
}
}
</script>

<input type="radio" name="comment1" value="1" onClick="showHideComment(this.value);"> On <br/>
<input type="radio" name="comment1" value="0" onClick="showHideComment(this.value);"> Off

<cfoutput query="showcomment">
<table width="100%" border="0" align="center" id="commentArea">
<tr>
<td>Subject:</td>
<td><b class="sidebar">#subject#</b></td>
</tr>
</table>
</cfoutput>

but problem lies here when it:

hides only one Section of Comments, What about if i had more than 10 comments.

i tried changes the variables but no luck

plz help