Shopify Question posted in
The Shopify help center can be found here.

Hiding class of a div, when a child div has the specific class name – Shopify

What I’m generally trying to do is, detect if our product from Trustpilot Widget has 0 reviews, and if it is, show another widget from Trustpilot that shows the number of reviews for our service instead.

Right now, I’m stuck in trying to hide the widget when there’s a div class called “tp-stars–0” found on the page.

Here’s what I got so far 

        $('.trustpilot-widget' ).ready(function() {
          if($('.tp-widget-stars').find('.tp-stars.tp-stars--0').length) {
            $('#tp-widget-wrapper').removeClass('visible');
          }
        });

  <div id="tp-widget-wrapper" class="tp-widget-wrapper visible">
      <div id="wrapper-company-stars" class="wrapper-company-stars">
        <!-- Stars -->
        <div id="tp-widget-stars" class="tp-widget-stars">
           <div class="">
             <div class="tp-stars tp-stars--0">
               <div style="position: relative; height: 0; width: 100%; 
                 padding: 0; padding-bottom: 18.326693227091635%;">
               </div>
            </div>
         </div>
      </div>
        <div class="tp-widget-readmore" id="numberOfReviews"><strong>No 
         reviews</strong>
        </div>
      </div>
  </div>
Tags:

2

Answers


  1. 0

    Start from the element and find the parent.

    $('.tp-stars--0').parent('#tp-widget-wrapper').removeClass('visible');
    Login or Signup to reply.
  2. 0

    Try using an each loop on the element and using closest to get the parent.

        $('.tp-widget-stars').find('.tp-stars.tp-stars--0').each(function() {
       if ($(this).length) {
         $(this).closest('#tp-widget-wrapper').removeClass('visible');
       }
    });
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search