title: Snap SVG .animate callback fires immediately
body: <p>I am trying to pass a set of arguments to an animate function within Snap SVG including a callback function. However, the callback (in this case is to remove the element) fires immediately on click and not after the animation has completed. As it is now, the element is removed and the animate function then errors because the element no longer exists. Any ideas?</p>
  
  <pre><code>    var theCallback = theApp.destroyAnElement("#"+ theParentID); 
  
  //The function call
  theAnimationFunctions.animateSingleSVGElementWithSnap('.stopped','#svg-container',{transform: 's1,0'}, 500, mina.backin, 0,0,theCallback);
  
  // The animate function
      animateSingleSVGElementWithSnap: function(element, parentSVG, animationValues, duration, easing, initialDelay, callback) {
         var s = Snap.select("#"+ parentSVG),
             theElement = s.select(element);
  
         setTimeout(function() {
           theElement.stop().animate(animationValues, duration, easing, function() {
               callback;
           });
        }, initialDelay);
      }
  </code></pre>
  
  <p><strong>UPDATE</strong></p>
  
  <pre><code>theCallback = function () { theApp.destroyAnElement("#"+ theElementID); };
  
  theAnimationFunctions.animateSingleSVGElementWithSnap('.stopped','#svg-container',{transform: 's1,0'}, 500, mina.backin, 0,0,theCallback);
  
  theAnimationFunctions = {
      animateSingleSVGElementWithSnap: function(element, parentSVG, animationValues, duration, easing, initialDelay, callback) {
      var s = Snap.select("#"+ parentSVG),
      theElement = s.select(element);
  
      setTimeout(function() {
         theElement.stop().animate(animationValues, duration, easing, function() {
              callback();
         });
      }, initialDelay);
  }
  </code></pre>
  
  <p>With the updates above, I now get an error at the completion of the animation:</p>
  
  <pre><code>"Uncaught TypeError: callback is not a function"
  </code></pre>