después de tanta investigación, he logrado esto, tenemos 3 imágenes y 3 opciones cuando selecciono la primera imagen, se selecciona la primera opción de selección, lo que queda es el evento onchange en select no funciona, ¿cómo puedo lograrlo? este es el código que he intentado que se active en el evento de cambio pero no tuve suerte

 $('.product-medias .swiper-slide').each(function(item, index){ $(this).click(function(){ console.log('clicked') var secondIndexSelect = $(this).attr('data-media-index'); var parsedIndex = parseInt(secondIndexSelect, 10) $("select#SingleOptionSelector-0 option").eq(`${parsedIndex}`).prop('selected', true).trigger('change'); // trigger "change" and "focus" i have tried both $('.product-single__media-s .product-single__media').removeClass('product-single__media--selected'); $(`.product-single__media-s .product-single__media:nth-child(${parsedIndex + 1})`).addClass('product-single__media--selected'); }) })

ahora mismo en mi código cuando selecciono la imagen del índice 1, la primera opción está seleccionada pero el evento de cambio no funciona. hay alguna forma de enlazarlo?