title: Drawing the Bounding Box for an element when you click it RaphaelJS
body: <p>So I tried using the getBBox() method for an element/set and using the x,y,width and height properties to define a rect. However the element has a drag event attached to it, Every time the drag event is triggered, it draws a new bounding box.</p>
  
  <p>I tried using element.remove after my drag function, to get rid of the element but I seem to be getting an element undefined error. </p>
  
  <pre><code>foo.click(function(){
      console.log(foo.getBBox());
      var herpaderp = drawBBox(foo.getBBox());
      console.log(herpaderp);
      dragsymbolsoncanvas(foo,herpaderp);
  });
  function dragsymbolsoncavas(foo,herpaderp){
      function dragger(){
          this.dx = this.dy = 0;
      };
      function mover(s){
          return function(dx, dy){
              if(this.data("candrag")=="true"){
                  (s||this).translate(dx-this.dx,dy-this.dy);
                  this.dx = dx;
                  this.dy = dy;
              }
          }
      };
      foo.drag(mover(foo), dragger);
      herpaderp.remove();
  };
  </code></pre>