캐러셀2

<button class="slide-1">1</button>
    <button class="slide-2">2</button>
    <button class="slide-3">3</button>
    <button class="next">다음</button>
    <button class="back">이전</button>

<script>

let 지금사진 = 1;

      $(".next").on("click", function () {
        if (지금사진 == 1) {
          $(".slide-container").css("transform", "translateX(-100vw)");
          지금사진++;
        } else if (지금사진 == 2) {
          $(".slide-container").css("transform", "translateX(-200vw)");
          지금사진++;
        }
      });

</script>

여기서 제가 <button class="slide-2">2</button> 버튼을 눌러도 지금사진== 1이잖아요. 그래서 이후에, 다음을 두번째 누를때까지 변화가 없는데, 이 부분은 어떻게 처리해야하나요?