jquery用鼠标将div1拖动到目标div2如何在目标div2中取到拖动div中的值？

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="ui.core.js"></script>
<script type="text/javascript" src="ui.draggable.js"></script>
<script type="text/javascript" src="ui.droppable.js"></script>
<script type="text/javascript">
$(function() {
$("#a1").draggable({ helper: 'clone'}); 
var nr=$("#a1").text();
$("#a1").draggable({
cursor: 'hand',
helper: function(event) {
return $('<div class="ui-widget-header">'+nr+'</div>');
}
});
$("#a1").droppable({
activeClass: 'droppable-active',
hoverClass: 'droppable-hover',
drop: function (event,ui){
$(this).addClass('b').find('p').html(nr);
}
});
});
</script>
<style type="text/css">
.drop { 
background-color: #e9b96e;
border: 3px double #c17d11;
width: 180px; 
height: 130px;
margin: 10px; 
position: absolute;
top: 5px;
left: 200px;
opacity: 0.7;
overflow:auto;
}
.droppable-active {
opacity: 1.0;
}
.droppable-hover {
outline: 1px dotted black;
}
</style>
</HEAD><BODY>
<div id="a1" style="position:absolute;width:50px;height:50px;left:20px;top:20px;background:00ff00;cursor:hand;">123</div><br>
<div class="drop" id="a2">
<p>ufdoiasu</p>
</div>
</BODY>
</HTML>