title: jquery adding class but dom not updating
body: <p>I am trying to create a variant of a page in console of the browser (<a href="https://direct.asda.com/george/women/dresses/ochre-ruched-front-floral-print-midi-dress/GEM652507,default,pd.html" rel="nofollow noreferrer">https://direct.asda.com/george/women/dresses/ochre-ruched-front-floral-print-midi-dress/GEM652507,default,pd.html</a>). The issue i am having is when i click on thumbnail the main image is not changing. Main slider should update when i click on thumbnail, slider arrows,pagination. and vice versa. thumbnail shoud show selected when clicked on arrow or pagination. I just want my code to work on browser console.</p>
  
  <p>below is my code:</p>
  
  <pre><code>$(function(){
  
  $(".inspirational-right").hide();           
      d = document.createElement('div');
      $(d).addClass("thumbnail")
      .insertAfter($(".product-name" ));
  $( ".swiper-slide.image-slide" ).clone().appendTo( ".thumbnail" );
  $(".inspirational-left").css({"width": "100%","float": "right", "position": "relative"});
  $(".thumbnail").css({"position":"absolute","z-index":"999","width": "140px", "height": "600px", "float": "left", "top": "1px","overflow": "hidden"});
  $(".thumbnail &gt; .swiper-slide.image-slide").css({"z-index":"999","transform": "scale(.18,0.18)","height": "112px", "width": "71px","cursor":"pointer"});
  $(".swiper-container.custom").css({"margin-left":"200px"});
  $(".thumbnail &gt; .swiper-slide.image-slide").click(function(){
    $(".thumbnail &gt; .swiper-slide.image-slide").removeClass("active");
    $(this).addClass("active");
    var imgId=$(this).attr("data-imageid");     
    $( ".swiper-container .swiper-wrapper .swiper-slide.image-slide" ).each(function() {
      $(".swiper-container .swiper-wrapper .swiper-slide.image-slide").removeClass("swiper-slide-active");  
      $(".swiper-container .swiper-wrapper .swiper-slide.image-slide").removeClass("swiper-slide-visible");      
      if($(this).attr("data-imageid")===imgId){
        $(this).addClass("swiper-slide-active");
      }        
    });      
  })
   });
  </code></pre>
  
  <p>updated with fix and suggestion</p>