Droppable body let revert a div on a valid dropp

if u dropp an div on a valid div it call the event but then it revert to his last position. but only if the body is droppable and was called before the droppable valid div.

	<div id="draggable" class="Item ui-widget-content" style="width:80px;">Drag me to my target</div>
	<div id="DroppDiv" style="width:100px;height: 100px;border: 1px solid black;">DroppDiv</div>

	<script type="text/javascript" charset="UTF-8">
	//<![CDATA[
	$(document).ready(function(){

		$('#DroppDiv').droppable({
			accept: 'div.Item',
			greedy: true,
			drop: function(event, ui){
			 console.log('DroppDiv');
			}
		});

		$(document.body).droppable({
		   accept: 'div.Item',
		   drop: function(event, ui){
			   console.log('body');
			}
		});

		$('#draggable').draggable({
		   revert: 'invalid',
		   revertDuration: 0
		});

	});
	//]]>
	</script>

try to drop the draggable-div on the droppable div. the event will be called und than it return....