diff --git a/js/bootstrap-twipsy.js b/js/bootstrap-twipsy.js
index a176f09088e248ccbde8bb827d2bcfc154379c6a..1ce4ad85b6910d596aff8c1d14792554e7c9de5c 100644
--- a/js/bootstrap-twipsy.js
+++ b/js/bootstrap-twipsy.js
@@ -155,7 +155,7 @@
   , setContent: function () {
       var $tip = this.tip()
       $tip.find('.twipsy-inner').html(this.getTitle())
-      $tip[0].className = 'twipsy'
+      $tip.removeClass('fade in top bottom left right')
     }
 
   , hide: function () {
diff --git a/js/tests/unit/bootstrap-twipsy.js b/js/tests/unit/bootstrap-twipsy.js
index 6623fc026ea34c8a47bb41ab879bf4c0a6a7ceac..08512ca97908ff5039ed901442a916fd9f393271 100644
--- a/js/tests/unit/bootstrap-twipsy.js
+++ b/js/tests/unit/bootstrap-twipsy.js
@@ -48,4 +48,15 @@ $(function () {
         ok(!$(".twipsy").length, 'twipsy removed')
       })
 
+      test("should respect custom classes", function () {
+        var twipsy = $('<a href="#" rel="twipsy" title="Another twipsy"></a>')
+          .appendTo('#qunit-fixture')
+          .twipsy({ template: '<div class="twipsy some-class"><div class="twipsy-arrow"/><div class="twipsy-inner"/></div>'})
+          .twipsy('show')
+
+        ok($('.twipsy').hasClass('some-class'), 'custom class is present')
+        twipsy.twipsy('hide')
+        ok(!$(".twipsy").length, 'twipsy removed')
+      })
+
 })
\ No newline at end of file