title: How to revert draggable back to original position?
body: <p>I'm creating a simple drag and drop game with jquery's draggable plugin. </p>
  
  <p>There are 4 shapes, circle, square, triangle and star, and 4 drop off areas in divs:</p>
  
  <pre><code>&lt;div class="drag"&gt;
      &lt;div class="container"&gt;
          &lt;div id="circle"&gt;&lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="container"&gt;
          &lt;div id="square"&gt;&lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="container"&gt;
          &lt;div id="triangle"&gt;&lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="container"&gt;
          &lt;div id="star"&gt;&lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="drop"&gt;
      &lt;div class="container"&gt;
          &lt;div id="circle"&gt;&lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="container"&gt;
          &lt;div id="square"&gt;&lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="container"&gt;
          &lt;div id="triangle"&gt;&lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="container"&gt;
          &lt;div id="star"&gt;&lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;  
  </code></pre>
  
  <p>This for example is the info for circle (please imagine the same with the rest of the shapes):</p>
  
  <pre><code>function init() {
  $('.drag #circle').data('shape','circle').draggable({
      cursor: 'move',
      stack: '#circle',
      revert: true
  });
      $('.drop #circle').data('shape','circle').droppable( {
          accept: '#circle',
          drop: handleDropEvent
      } );
  };
  init();
  </code></pre>
  
  <p>This is the handle drop event:</p>
  
  <pre><code>function handleDropEvent( event, ui ) {
      var item = $(this).data('shape');
      var drop = $(this).data('shape');
      var dragItem = ui.draggable;
      if (item==drop){
          dragItem.position( { of: $(this), my: 'left top', at: 'left top' } );
          dragItem.draggable( 'option', 'revert', false );
          dragItem.draggable( 'disable' );
          $(this).droppable( 'disable' );
          correctMatch++;
  
      } 
      if ( correctMatch == 4 ) {
          $('.replay').show();
          $('.replay').click(function(){
              init();
          });
      }
  }
  </code></pre>
  
  <p>Now in the replay class is a replay button. How do I have my shapes revert back to their original position?</p>