Remove element from all but shop pages with javascript

Hi, I need some help with javascript. I want to remove a search bar (in mobile view especially) from my footer.

- I (successfully) identify whether the url has shop in it.
- then i have an "if" statement that should remove the whole search bar if shop is NOT mentioned in the url.
- beforehand i am doing a function to move my search bar into another element on the page. This works well

My problem is removing the search bar.

<!--SEARCH BAR-->
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script>
   var getURL = window.location.href;
   var subString = 'shop';
 
     $(function(){
 let searchBlock = $('#block-yui_3_17_2_1_1717927882701_20949').attr('id','').addClass('header-search-bar');
 $(searchBlock).insertAfter($('.nested-category-title'));
 $(searchBlock).clone().addClass('mobile-header-search-bar').appendTo($('.header-menu-nav-folder-content'));
 })

     if (getURL.includes(subString)) {
          console.log('The URL contains the string "' + subString + '".');
       
     }
     else {
          console.log('The URL does not contain the string "' + subString + '".');
           $('#block-yui_3_17_2_1_1717927882701_20949').remove();
      }      
</script>

Please help!

polivantage.com/shop

I suggest breaking this into two issues. When to display the search block and how to move the search block. For the display issue I think you can get this done with CSS alone.

/* only display search block on shop page */

body:not( #collection-6655dc8acb0c260693796438 ) .fe-block-yui_3_17_2_1_1717927882701_20949 {

  display : none;
  
  }

You can target the Fluid Engine class or id for the block.

Then your JavaScript code can deal with only moving the block where needed.

Let us know how it goes.