jQueryのフリック実装で、謎の丸が出る

jQueryでフリックを実装しているのですが、画像内の右箇所に丸印●が付いてます。
消し方が分からないので、教えていただきたいです。
https://gyazo.com/eb6ca8aa7daef4e19bd5075f98eea03b
分かりにくくて、すいません。画像のせいではなく、コードによって丸が出ております。

<div class="swipe-photo">
  <ul class="swipe-photo-container clearfix">
    <li class="swipe-photo-item"><img src="img/0.jpg" class="swipe-photo-thumbnail"></li>
    <li class="swipe-photo-item"><img src="img/1.jpg" class="swipe-photo-thumbnail"></li>
    <li class="swipe-photo-item"><img src="img/2.jpg" class="swipe-photo-thumbnail"></li>
    <li class="swipe-photo-item"><img src="img/3.jpg" class="swipe-photo-thumbnail"></li>
    <li class="swipe-photo-item"><img src="img/4.jpg" class="swipe-photo-thumbnail"></li>
    <li class="swipe-photo-item"><img src="img/5.jpg" class="swipe-photo-thumbnail"></li>
  </ul>
  <div id="text"></div>
</div>

   let container = $(".swipe-photo-container"),
        images = container.find("img"),
        width = images.width(),
        length = images.length,
        array = [],
        x = null,
        thisX = null,
        startX = null,
        moveX = null;

    for (var i = 0; i <= length; i++) {
      array[i] = -i * width
    }
    container.width(width * length);
    $(".swipe-photo-thumbnail").on({
        touchstart: function (event) {
            thisX = parseInt(container.css("left"));
            startX = event.originalEvent.changedTouches[0].pageX - thisX;
        },
        touchmove: function (event) {
            event.preventDefault();
            x = event.originalEvent.changedTouches[0].pageX;
      
          for (let l = 0; l < length; l++) {
            if (array[l] + (width / 2) > moveX && moveX >= array[l + 1] + (width / 2)) {
                  m = l
              };
          };
          container.animate ({
              left: array[m]
          }, 400);
        }
    });

array = []が影響していると思うのですが原因が分かりません。よろしくお願い致します。
またjQueryオブジェクトは、$で始めてるつもりですが、間違えている記載あればご指摘のほどよろしくお願い致します。