Как добавить toggleClass в очередь?

Question

[n1ksON]

Передо мной стоит задача сделать 3 картинки, которые появляются поочередно. С двумя проблем не было. Теперь нужно как-то добавить появление третей картинки в очередь, но никак не могу разобраться как именно это сделать.
Изначально первая картинка видна, а две другие нет. Я бы хотел, чтобы потом пропадала первая, появлялась вторая. И с третьей аналогично.

setInterval(() => {
        $('.carousel__first').toggleClass('opacity');
        $('.carousel__second').toggleClass('opacity');
        $('.carousel__third').toggleClass('opacity');
}, 5000);

Это CSS. Сделал через toggleClass только из-за opacity, чтобы было анимированный и красивый переход исчезания и появления.

.opacity {
    opacity: 0;
}

А так выглядит HTML.

<div class="carousel-content">
                <div class="carousel__first carousel__part">
                    <img src="images/alience.png" class="carousel__img_size" alt="">
                </div>
                <div class="carousel__second carousel__part opacity">    
                    <img src="images/manufactura.jpg" class="carousel__img_size" alt="">
                </div>
                <div class="carousel__third carousel__part opacity">
                    <img src="images/nigma.png" class="carousel__img_size" alt="">
                </div>
            </div>

Заранее спасибо за помощь!