我尝试创建 JS 轮播，它适用于 1 张幻灯片，同一页面上的第二个滑块不起作用，需要帮助同一页面上的多个滑块

Question

我正在尝试创建一个 JS 旋转木马，它仅适用于第一个滑块，同一页面上的第二个滑块不起作用，请帮助同一页面上多个滑块的 jscript。

html

               <div class="movie-list" id="slider1">
                    <div class="movie-list-item">
                        <img class="movie-list-item-img" src="img/black_panther.jpg" alt="Black_Panther.jpg" draggable="false">
                        <span class="movie-list-item-title">Black Panther</span>
                        <p class="movie-list-item-desc">
                            T'Challa, heir to the hidden but advanced kingdom of Wakanda,
                            must step forward to lead his people into a new future.
                        </p>
                        <button class="movie-list-item-button">WATCH</button>
                    </div>
                    <div class="movie-list-item">
                        <img class="movie-list-item-img" src="img/John-wick.jpg" alt="Black_Panther.jpg" draggable="false">
                        <span class="movie-list-item-title">Black Panther</span>
                        <p class="movie-list-item-desc">
                            T'Challa, heir to the hidden but advanced kingdom of Wakanda,
                            must step forward to lead his people into a new future.
                        </p>
                        <button class="movie-list-item-button">WATCH</button>
                    </div>

            <button class="slider-btn">
                    <i id="right" class="arrow btn-right"></i>
                </button>
                <button class="slider-btn">
                    <i id="left" class="arrow btn-left"></i>
                </button>
            </div>

JScript

const carousel = document.querySelector(".movie-list"),
firstImg = carousel.querySelectorAll(".movie-list-item")[0];
arrowIcons = document.querySelectorAll(".arrow");
let firstImgWidth = firstImg.clientWidth + 15;
arrowIcons.forEach(icon => {
    icon.addEventListener("click", () => {       
        carousel.scrollLeft += icon.id == "left" ? -firstImgWidth : firstImgWidth;
    });
});