Necesito cambiar el orden de las diapositivas en el front-end, para que mi cliente pueda seleccionar la posición/el orden de cada diapositiva. Acabo de darme cuenta de que podría usar la propiedad "order: x" de css flex box pero no funciona bien si tengo activado el modo Loop.

 <div class="jt-slider">
 <div class="swiper-wrapper">

 <div class="swiper-slide" style="background-image: url(coming/jt_0.jpg)"></div>
 <div class="swiper-slide" style="background-image: url(coming/jt_1.jpg)"></div>
 <div class="swiper-slide" style="background-image: url(coming/jt_2.jpg)"></div>
 <div class="swiper-slide" style="background-image: url(coming/jt_3.jpg)"></div>
 <div class="swiper-slide" style="background-image: url(coming/jt_4.jpg)"></div>
 <div class="swiper-slide" style="background-image: url(coming/jt_5.jpg)"></div>
 <div class="swiper-slide" style="background-image: url(coming/jt_6.jpg)"></div>
 <div class="swiper-slide" style="background-image: url(coming/jt_7.jpg)"></div>
 <div class="swiper-slide" style="background-image: url(coming/jt_8.jpg)"></div>
 <div class="swiper-slide" style="background-image: url(coming/jt_9.jpg)"></div>
 <div class="swiper-slide" style="background-image: url(coming/jt_10.jpg)"></div>
 <div class="swiper-slide" style="background-image: url(coming/jt_11.jpg)"></div>
 <div class="swiper-slide" style="background-image: url(coming/jt_12.jpg)"></div>
 <div class="swiper-slide" style="background-image: url(coming/jt_13.jpg)"></div>
 <div class="swiper-slide" style="background-image: url(coming/jt_14.jpg)"></div>
 
 </div>

Esa es la estructura html básica de Swiper, cuando se procesa el modo de bucle, copia todos los divs y agrega una clase "swiper-slide-duplicate"

Es extraño que Swiper no tenga una opción específica para reordenarlos de forma independiente después del renderizado...

Estoy usando JavaScript nativo, Jquery y CSS

¡Gracias!