jQuery.Swiper.js pagination not working, how to setup?-CodePudding

Slider works but pagination is not visible

HTML:

<div >
    <div >
      <div >
        <img  src="/assets/img.png" />
      </div>
      <div >
        <img  src="/assets/img.png" />
      </div>
      <div >
        <img  src="/assets/img.png" />
      </div>
      <div >
        <img  src="/assets/img.png" />
      </div>
    </div>
    <div ></div>

JS:

$(document).ready(() => {
  var swiper = new Swiper(".swiper-container", {
        pagination: {
          el: ".swiper-pagination",
          clickable: true,
          renderBullet: function (index, className) {
            return '<span >'   "</span>";
          },
        },
      });
    })

The scripts are connected, the slider works. But we see that there is simply no pagination, and it's not about styles

CodePudding user response：

You're using <div ></div> outside the scope of <div >

Have a look at this code on jsfiddle that I wrote for you:

https://jsfiddle.net/udf82qaw/