Don't know if I'm missing something but I cant hide a div when its in a 'thickbox'.

All I'm trying to achieve is to have a list of popup options that are grouped under different headings. By default the groups will be collapsed, the user expands them as required. I just can't get the click event on the first legend element to fire. Any ideas? It works fine when its not in the thickbox?

Thanks in advance!

		<script type="text/javascript" src="jquery.js"></script>
		<script type="text/javascript" src="thickbox.js"></script>
		<link rel="stylesheet" href="thickbox.css" type="text/css" media="screen" />	
		<style type="text/css">

			    border-color: #000000;
			    border-width: 1px 0px 0px 0px;
			    border-style: solid none none none;
			    padding: 10px;
			    margin: 0px;
			    font-family:Verdana, Arial, Helvetica, sans-serif;
			fieldset legend
			    font-size: 1.25em;
			    font-weight: bold;
				color: white;
			    margin: 0px 0px 10px 0px;
			    padding: 0px 5px;
				background: silver url('../img/ghead.jpg') repeat-x scroll;
		<script type="text/javascript">

		<a href="#TB_inline?height=400&width=500&inlineId=hiddenContent" title="Show option" class="thickbox">Show hidden content.</a>

			<div id="hiddenContent">
			<!-- <div>		-->
					<legend id="pcontenttoggle" name="pcontenttoggle">Title 1</legend>	
					<div id="pcontent" name="pcontent">
						<input name='chk1' type="checkbox" id="chk1" />
						<input name='chk2' type="checkbox" id="chk2" />
						<input name='chk3' type="checkbox" id="chk3" />
					<legend id="pcontenttoggle2" name="pcontenttoggle2">Title 2</legend>	
					<div id="pcontent2" name="pcontent2">
						<input name='chk4' type="checkbox" id="chk4" />
						<input name='chk5' type="checkbox" id="chk5" />
						<input name='chk6' type="checkbox" id="chk6" />