Javascript-форум - Drag & Drop с несколькими элементами

Всем привет! Помогите пожалуйста со скриптом. На выбор есть 3 элемента при перетаскивании которых в блоке result появляется информации о них.
Проблема в том что пока при перетаскивании разных элементов, в result появляется одна и таже информация.
Выглядеть должно было так:
При перетаскивании элемента1, появляется информация1. При перетаскивании элемента2, информация1 удаляется и появляется информация2 и тд.

В js особо не разбираюсь, но сделать надо.. поэтому пожалуйста более понятным языком объясните :-?
Вот код:

<script type="text/javascript">
$(function(){
  $("#draggable1").draggable();
  $("#droppable").droppable({
  	drop: function(){
  	  $("#result").append("Dropped!<br /><p>Da Vinci</p>");
  	}
  });
});
$(function(){
  $("#draggable2").draggable();
  $("#droppable").droppable({
  	drop: function(){
  	  $("#result").append("Dropped!<br /><p>Newton</p>");
  	}
  });
});
$(function(){
  $("#draggable3").draggable();
  $("#droppable").droppable({
  	drop: function(){
  	  $("#result").append("Dropped!<br /><p>Goethe</p>");
  	}
  });
});
</script>
</head>
<body>
<div id="draggable1" class="ui-widget-content">
  <p>Da Vinci</p>
</div>
<div id="draggable2" class="ui-widget-content">
  <p>Newton</p>
</div>
<div id="draggable3" class="ui-widget-content">
  <p>Goethe</p>
</div>
<div id="droppable" class="ui-widget-header">
  <p>Drop here</p>
</div>
<div id="result"></div>
</body>

Demo