title: jQuery UI remove element when dropped into a div using .droppable
body: <p>I'm trying to figure out the logic of how to do this.</p>
  
  <p>I have many images with only a CSS class name, they are created dynamically.</p>
  
  <p>These images are draggable using jQuery UI's <code>.draggable.</code></p>
  
  <p>I need to have a "trash can" that when an element is dragged into , it is removed.</p>
  
  <p><strong>Example</strong>: <a href="http://jsfiddle.net/KWdcU/3/">http://jsfiddle.net/KWdcU/3/</a> (This is set to remove all elements and not the one dragged into it)</p>
  
  <p><strong>Code</strong>:</p>
  
  <pre><code>&lt;div class ="box"&gt;
  &lt;div class="stack"&gt;one&lt;/div&gt;
  &lt;div class="stack"&gt;two&lt;/div&gt;
  &lt;/div&gt;
  &lt;div id="trash"&gt;trash&lt;/div&gt;​
  
  
  
  $(function() {
          $( ".stack" ).draggable();
  });
  
  $('#trash').droppable({
              over: function() {
               //alert('working!');
              $('.box').remove();
            }
      });
  </code></pre>
  
  <p>​</p>