Show span content in other element after span's parent is hovered jQuery

Show span content in other element after span's parent is hovered jQuery

I'm trying to figure out how to make it so that when you hover a box, the
element's span's text shows in a specific div.
http://jsfiddle.net/zACX4/
HTML
<ul id="specs">
<li><a id="img1" href=""><span>ldldld</span></a></li>
<li><a id="img2" href=""><span>ldldld</span></a></li>
<li><a id="img3" href=""><span>ldldld</span></a></li>
<li><a id="img4" href=""><span>ldldld</span></a></li>
<li><a id="img5" href=""><span>ldldld</span></a></li>
<li><a id="img6" href=""><span>ldldld</span></a></li>
<li id="mid"><div id="specs_detail"></div></li>
</ul>
jQuery
$(document).ready(function(){
$('#specs li a').hover(function(){
var toLoad = $(this).find('span');
$('#specs_detail p').fadeOut('fast',loadContent);
function loadContent() {
$('#specs_detail p').load(toLoad,'',showNewContent())
}
function showNewContent() {
$('#specs_detail p').fadeIn('fast');
}
return false;
});
});