Problema con javascript, cambiar contenido div

[zaphiel]

Me sigue sin funcionar... tengo esto:

Código HTML:

CSS
	<style> 
		body{
			font-family:sans-serif;
			padding:0;
			margin:0;
		}
		.right
		{
			
			float:right;
			width:100%;
			padding-left:250px;
		}
		.top
		{
			float:left;
			
			width:100%;
			height:50px;
			position:fixed;
			top:0;
			
			background-color:red;
			box-shadow:0px 0px 10px rgba(0, 0, 0, 0.7);
		}
		.menu-item
		{
			position:relative;
			float:left;
			
			padding: 10px 15px 0 15px;
			height:40px;
			
		}
		.menu-item:hover
		{
			background-color:#ffc72e;
			cursor:pointer;
		}
		.menu-item-selected
		{
			background-color:black;
			color:white;
		}
			
		#panel-frame
		{
			width:100%;
			position:fixed;
			height:50px;
		}
		.panel
		{
			background-color:#f2f2f2;
			position:relative;
			width:100%;
			height:50px;
			box-shadow:0px 0px 10px rgba(0, 0, 0, 0.7);
			top:0px;	 
		}
		
	</style> 

Código HTML:

SCRIPT
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
	
	
	<script type="text/javascript">
		function loadContent()
		{
			
		}

	   $('.block').click
	   (
			function()
			{
				
				var id= $(this).attr('dataid');
				var did="#" + id;
				var data_id= $(did).html();
				var panel= $('.panel');
				var panel_width=$('.panel').css('top');		
				var pixels = parseInt(panel_width,0);
				
				
				//close the element if it was already selected
				if($(this).hasClass("menu-item-selected"))
				{
					//remove css class
					$(this).removeClass("menu-item-selected");
					
					//close the item
					panel.animate({top: 0});
				}
				//open it up if not selected or changing element
				else
				{
					//remove all selected tags
					$('.block').removeClass("menu-item-selected");
					
					//add it to the current one
					$(this).addClass("menu-item-selected");
					
					//if opened, close open and open it up again
					if(pixels > 0)
					{
						panel.animate({top: 0},function()
						{
							//empty data
							$('.data').html('');
						})
						.animate({top: panel.outerHeight() },
							function()
							{
								//AJAX CALL OR COPY ELEMENT TO .data using loadContent(toElement,fromWhere); 
								// toElement -> CSS selector, fromWhere, CSSSelector
								$('.data').html(data_id);		
							}
						);
					}
					//open/close	panel
					else
					{
						panel.animate({top: pixels == 0 ? +panel.outerHeight() : 0},
						function()
						{
								//AJAX CALL OR COPY ELEMENT TO .data using loadContent(toElement,fromWhere); 
								// toElement -> CSS selector, fromWhere, CSSSelector	
								$('.data').html(data_id);	
						}
						);
					}
					
				}
				
				return false;												
			}
		);
	  
		$('.close').click
		(
			function() 
			{
				var panel= $('.panel');
				panel.animate({top: parseInt(panel.css('top'),0) == 0 ? +panel.outerHeight() : 0});
				return false;
			}
		);  

	</script> 

Código HTML:

<div id="container"> 
		
		<div id="panel-frame"> 
			<div class="panel"> 
				<!-- Content to load in slide-in menu	-->
				
				<div class="data" >
				
				</div>
			</div> 
		</div> 
 		<div class="top"> 
			<div class="menu-item block" dataid="1">Item1</div> 			
			<div class="menu-item block" dataid="2">Item2</div> 
			<div class="menu-item block" dataid="3">Item3</div> 
		</div> 
		<div style="display:none">
				<div id="1">Test</div> 	
				<div id="2">Asdf</div> 	
				<div id="3">asdasdad</div> 	
		</div>
	</div> 

Algo se me esta pasando o he puesto mal.

Gracias.