jQuery轮播图

<style>
    img {
        width: 400px;
        height: 200px;
    }

    .active {
        background-color: grey;
    }
</style>

 <div>
        <img class="img" src="images/1.png" alt="">

    </div>
    <button class="active">1</button>
    <button>2</button>
    <button>3</button>
    <script src="script/jquery.js"></script>

    <script src="script/jquery.js"></script>
    <script>
        let images = [
            "images/1.png",
            "images/2.png",
            "images/3.png"
        ]
        $("button").click(function () {
            let index = $(this).index();
            $("img").attr("src", images[index - 1]);
            $(this).addClass("active");

            $(this).siblings("button").removeClass("active");
        })

        console.log(images)
    </script>