Не удается найти селектор в HTML, сгенерированном Vue JS

Question

Мой код jQuery не может найти этот селектор $(".product-item-wrapper"), но он работает в консоли, сгенерированной VueJS.Должен ли я использовать jQuery в файле .js для вызова img с помощью этого селектора?

Это мой vue.js

Vue.component('product-item', {
  data: function() {
}, template: `
    <div class="col-6 col-md-4 product-item-wrapper">
            <div>........
                <div class="col-12 col-md-4">
                       <div class="row">
                               <div class="col-6 text-right">
                                   <div :class="'zoomAction-' + product.nid.value">
                                       <i class="fas fa-search-plus icon_size"></i>
                                   </div>
                                   <div class="pdesc font2">
                                       <span v-show='productCurrency !== "" && productPrice !== "" && !isInsight'>
                                       </span>
                                   </div>
                               </div>
                               <div class="col-6 text-left">
                                   <a class="c_ico c_ico_cart_add cartMenu" href="#" @click="addSingleProductToCart">
                                       <div class="plusSym">
                                           <i class="far fa-heart icon_size"></i>
                                       </div>
                                   </a>
                               </div>
                       </div>
                </div>
            </div>
        </div>
    </div>`,
  methods: {}
})

Это jQuery в файле .js

  jQuery.each($(".product-item-wrapper "), function() {
    var imgele = $(this).find("[class^=product-zoom-]");
    var zoom =$(this).find("[class^=zoomAction-]");        
    $(zoom).magnificPopup({
        mainClass: 'mfp-fade',
        midClick: true,
        removalDelay: 600,
        fixedContentPos: true,
        fixedBgPos: true,
        gallery: { enabled: true },
        type: 'image',
        callbacks: {
            elementParse: function(item) {
                //console.log($(imgele)[0].childNodes[0].currentSrc);
                item.src =  $(imgele).children().attr("src");
            }
        }
     });
  });