From 291bbac5194c47c34c54de5c54d9a792004922e7 Mon Sep 17 00:00:00 2001
From: Johann-S <johann.servoire@gmail.com>
Date: Wed, 31 Jul 2019 22:00:11 +0200
Subject: [PATCH] remove jquery in scrollspy docs

---
 site/content/docs/4.3/components/scrollspy.md | 26 ++++++++++++++-----
 1 file changed, 20 insertions(+), 6 deletions(-)

diff --git a/site/content/docs/4.3/components/scrollspy.md b/site/content/docs/4.3/components/scrollspy.md
index f44e759b8a..b390ddf9e2 100644
--- a/site/content/docs/4.3/components/scrollspy.md
+++ b/site/content/docs/4.3/components/scrollspy.md
@@ -252,7 +252,9 @@ body {
 After adding `position: relative;` in your CSS, call the scrollspy via JavaScript:
 
 {{< highlight js >}}
-$('body').scrollspy({ target: '#navbar-example' })
+var scrollSpy = new bootstrap.ScrollSpy(document.body, {
+  target: '#navbar-example'
+})
 {{< /highlight >}}
 
 {{< callout danger >}}
@@ -269,20 +271,31 @@ Target elements that are not visible will be ignored and their corresponding nav
 
 ### Methods
 
-#### `.scrollspy('refresh')`
+#### refresh
 
 When using scrollspy in conjunction with adding or removing of elements from the DOM, you'll need to call the refresh method like so:
 
 {{< highlight js >}}
-$('[data-spy="scroll"]').each(function () {
-  var $spy = $(this).scrollspy('refresh')
+var dataSpyList = [].slice.call(document.querySelectorAll('[data-spy="scroll"]'))
+dataSpyList.forEach(function (dataSpyEl) {
+  bootstrap.ScrollSpy.getInstance(dataSpyEl)
+    .refresh()
 })
 {{< /highlight >}}
 
-#### `.scrollspy('dispose')`
+#### dispose
 
 Destroys an element's scrollspy.
 
+#### getInstance
+
+*Static* method which allows you to get the scrollspy instance associated with a DOM element
+
+{{< highlight js >}}
+var scrollSpyContentEl = document.getElementById('content')
+var scrollSpy = bootstrap.ScrollSpy.getInstance(scrollSpyContentEl) // Returns a Bootstrap scrollspy instance
+{{< /highlight >}}
+
 ### Options
 
 Options can be passed via data attributes or JavaScript. For data attributes, append the option name to `data-`, as in `data-offset=""`.
@@ -336,7 +349,8 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
 </table>
 
 {{< highlight js >}}
-$('[data-spy="scroll"]').on('activate.bs.scrollspy', function () {
+var firstScrollSpyEl = document.querySelector('[data-spy="scroll"]')
+firstScrollSpyEl.addEventListener('activate.bs.scrollspy', function () {
   // do something...
 })
 {{< /highlight >}}
-- 
2.47.2