Переключение блоков фото в другую сторону в блоке

[bodyak0]

Всем привет, нужно мне вывести 2 блока чтобы картинки сладера чередовались.
Не знаю как на Js это реализовать чтобы каждый блок был со своим классом к примеру вот статикой если выводить но нормально все:
Помогите сделать nth-child как то))Спасибо! С меня пивасик

<div class="featuted-product-wrap section-space--pt_120">
            <div class="container">
                <div class="row align-items-center featuted-product-one">
                    <div class="col-lg-6 col-md-6 order-md-1 order-1">
                        <div class="product-thumbnail">
                            <a href="shop-left-sidebar.html"><img src="images/df-1.png" class="img-fluid" alt="Featured Image"></a>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 order-md-2 order-2">
                        <div class="featured-product-contect">
                            <h6 class="sub-heading mb-2">FEATURED PRODUCT</h6>
                            <h2 class="section-title--one"><a href="shop-left-sidebar.html">Категория Chair</a></h2>
                            <p class="mt-30">When an unknown printer took a galley of type and scrambled it to make a
                                type specimen book. Excepteur sint occaecat cupidatat non proident, sunt in
                                culpa qui officia.</p>
                            <div class="button-box section-space--mt_60">
                                <a href="shop-4-column.html" class="btn btn--md btn--border_1">Only $90 <i class="icon-arrow-right"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="images-text-bg text-right">
                <img src="images/bg-df-1-300x49.png" class="img-fluid" alt="">
            </div>
        </div>

<div class="featuted-product-wrap section-space--pt_120">
            <div class="container">
                <div class="row align-items-center featuted-product-one">
                    <div class="col-lg-6 col-md-6 order-md-2 order-1">
                        <div class="product-thumbnail">
                            <a href="shop-left-sidebar.html"><img src="images/df-2.png" class="img-fluid" alt="Featured Image"></a>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 order-md-1 order-2">
                        <div class="featured-product-contect">
                            <h6 class="sub-heading mb-2">FEATURED PRODUCT</h6>
                            <h2 class="section-title--one"><a href="#">ДРУГАЯ КАТЕГОРИЯ</a></h2>
                            <p class="mt-30">Excepteur sint occaecat cupidatat non proident, sunt in culpaqui <br>
officia deserunt mollit anim id est laborum</p>
                            <div class="button-box section-space--mt_60">
                                <a href="shop-4-column.html" class="btn btn--md btn--border_1">Only $50 <i class="icon-arrow-right"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="images-text-bg text-left">
                <img src="images/h1-1-300x122.png" class="img-fluid" alt="">
            </div>
        </div>

[Seriusis]

а зачем js ? я так понял вам нужен индивидуальный класс, то можно просто в php выводит номер элемента массива, типа order-<?php echo $i; ?>

[Seriusis]

а, у вас твиг, тогда

order-{{ loop.index }} пишите в класс

[bodyak0]

41 хвилину назад, Seriusis сказав:

а, у вас твиг, тогда

order-{{ loop.index }} пишите в класс

Можно подробнее?)Если можно в ЛС за монетку подсобите?