title: jQuery: How to destroy or reset a plugin
body: <p>To preface this, I hope it's possible to get a general answer to this question on best practice on how to accomplish something like this, as well as a possible answer to my specific ask?</p>
  
  <p>I have been working on a "prove you are human" plugin and I have it working when everything loads.  I am using jQuery UI as it's backbone and am using Draggable and Droppable.  The general question is: How do I destroy and reset a plugin on an event?  The more specific question is: When I drag the wrong object onto the spot, how can I reset the ability to drag and drop after everything is destroyed.</p>
  
  <p>Below is pseudo code:</p>
  
  <pre><code>(function($){  
      $.fn.robotProof = function(options){
          var defaults = {
              //Default variables
          }
  
          var options = $.extend(defaults, options);
          return this.each(function(defaults){
          /* Here I style the elements because they were not styled by a CSS
             Then I randomly assign the elements a spot and append them to the container
             Then I use Draggable and Droppable */
  
          $('.peg').draggable({
              drag: function() {
                  /* Drag Function Here */
              },
              revert: 'invalid'
          });
          $('.hole').droppable ({
              accept: '.valid',
              drop: function(){
                  var username = $('#username').val();
                  var email = $('#email').val();
                  var password = $('#password').val();
                  if(!username || !email || !password){ //IF ONE OF THE INPUTS IS EMPTY
                      $('.hardError').html("You've forgotten something").slideDown(300);
                      //////* THIS IS WHERE I NEED TO DESTROY/RESET THIS PLUGIN *//////////       
                  } else {                        
                      $('.valid').animate({left: "286px",top: "1px"});//success
                  }
              }
          });
      };
  })(jQuery);  
  $(document).ready(function(){
      $('.robotProof').robotProof();
  });
  </code></pre>
  
  <p>You can see in the droppable code, on the error (This will be on ALL errors eventually) I need to be able to RESET the plugin. </p>
  
  <p>I feel like (and have played with this idea) that almost the entire code needs to be a function so I can call the function again.  When I tried that, I had to then nest the code because it wouldn't allow the elements to be draggable again, unless I put those elements in the function as well, which would then call it's own function, which we all know doesn't work like that.</p>
  
  <p>I have written a couple successful plugins before, but this is a question I have had throughout every one of them.  How can I destroy all instances of this then reset the plugin without refreshing the page.  </p>