diff --git a/js/src/popover.js b/js/src/popover.js
index 02efe2b2ed..f89d3d5c8b 100644
--- a/js/src/popover.js
+++ b/js/src/popover.js
@@ -22,6 +22,8 @@ const Popover = (($) => {
   const DATA_KEY            = 'bs.popover'
   const EVENT_KEY           = `.${DATA_KEY}`
   const JQUERY_NO_CONFLICT  = $.fn[NAME]
+  const CLASS_PREFIX        = 'bs-popover'
+  const BSCLS_PREFIX_REGEX = new RegExp(`(^|\\s)${CLASS_PREFIX}\\S+`, 'g')
 
   const Default = $.extend({}, Tooltip.Default, {
     placement : 'right',
@@ -107,6 +109,10 @@ const Popover = (($) => {
       return this.getTitle() || this._getContent()
     }
 
+    addAttachmentClass(attachment) {
+      $(this.getTipElement()).addClass(`${CLASS_PREFIX}-${attachment}`)
+    }
+
     getTipElement() {
       return this.tip = this.tip || $(this.config.template)[0]
     }
@@ -130,6 +136,14 @@ const Popover = (($) => {
               this.config.content)
     }
 
+    _cleanTipClass() {
+      const $tip = $(this.getTipElement())
+      const tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX)
+      if (tabClass !== null && tabClass.length > 0) {
+        $tip.removeClass(tabClass.join(''))
+      }
+    }
+
 
     // static
 
diff --git a/js/src/tooltip.js b/js/src/tooltip.js
index 505a8d492a..fb4ff131c4 100644
--- a/js/src/tooltip.js
+++ b/js/src/tooltip.js
@@ -33,6 +33,8 @@ const Tooltip = (($) => {
   const EVENT_KEY           = `.${DATA_KEY}`
   const JQUERY_NO_CONFLICT  = $.fn[NAME]
   const TRANSITION_DURATION = 150
+  const CLASS_PREFIX        = 'bs-tooltip'
+  const BSCLS_PREFIX_REGEX = new RegExp(`(^|\\s)${CLASS_PREFIX}\\S+`, 'g')
 
   const Default = {
     animation   : true,
@@ -269,6 +271,7 @@ const Tooltip = (($) => {
           this.config.placement
 
         const attachment = this._getAttachment(placement)
+        this.addAttachmentClass(attachment)
 
         const container = this.config.container === false ? document.body : $(this.config.container)
 
@@ -332,6 +335,7 @@ const Tooltip = (($) => {
           tip.parentNode.removeChild(tip)
         }
 
+        this._cleanTipClass()
         this.element.removeAttribute('aria-describedby')
         $(this.element).trigger(this.constructor.Event.HIDDEN)
         if (this._popper !== null) {
@@ -383,6 +387,10 @@ const Tooltip = (($) => {
       return Boolean(this.getTitle())
     }
 
+    addAttachmentClass(attachment) {
+      $(this.getTipElement()).addClass(`${CLASS_PREFIX}-${attachment}`)
+    }
+
     getTipElement() {
       return this.tip = this.tip || $(this.config.template)[0]
     }
@@ -624,6 +632,14 @@ const Tooltip = (($) => {
       return config
     }
 
+  _cleanTipClass() {
+    const $tip = $(this.getTipElement())
+    const tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX)
+    if (tabClass !== null && tabClass.length > 0) {
+      $tip.removeClass(tabClass.join(''))
+    }
+  }
+
 
     // static
 
diff --git a/js/tests/index.html b/js/tests/index.html
index 81efd5876d..d17608e4a9 100644
--- a/js/tests/index.html
+++ b/js/tests/index.html
@@ -7,7 +7,7 @@
 
     <!-- jQuery -->
     <script src="../../docs/assets/js/vendor/jquery-slim.min.js"></script>
-    <script src="../../docs/assets/js/vendor/tether.min.js"></script>
+    <script src="../../docs/assets/js/vendor/popper.min.js"></script>
 
     <!-- QUnit -->
     <link rel="stylesheet" href="vendor/qunit.css" media="screen">
diff --git a/js/tests/unit/tooltip.js b/js/tests/unit/tooltip.js
index 8cb1a6fdf1..dc6364415a 100644
--- a/js/tests/unit/tooltip.js
+++ b/js/tests/unit/tooltip.js
@@ -111,7 +111,7 @@ $(function () {
 
     assert
       .ok($('.tooltip')
-      .is('.fade.bs-tether-element-attached-top.bs-tether-element-attached-center.show'), 'has correct classes applied')
+      .is('.fade.bs-tooltip-bottom.show'), 'has correct classes applied')
 
     $tooltip.bootstrapTooltip('hide')