jQuery class selector

Site URL: https://ngapsms.com

Hey All!

I'm struggling with the following code:

<!--
<style>
.sqs-cookie-banner-v2.DARK {
  display: none;
  }
</style>
-->

<script>
//check if running gonative
  if (navigator.userAgent.indexOf('gonative') > -1) {  
    //hide cookie banner
    $(".sqs-cookie-banner-v2.DARK").hide();
    console.log("yes gonative");
  }  else  {
    //show cookie banner
    $('.sqs-cookie-banner-v2.DARK').show();
    console.log($('.sqs-cookie-banner-v2.DARK').attr('style'));
    console.log("no gonative");
 }
</script>

I've loaded 3.6.0 jQuery and I'm loading this code in the footer of my site.  

What I find is that the jQuery selector on class' doesn't seem to work.  I can select all p's or h2's tags and it works great, but using class' fails consistently.   Also, the commented style does work, so it makes me feel like the class is correct. 

Should this work, or is there something that I'm missing?

The first change I suggest is to wrap your jQuery in a document ready.

<script>
  $( ( ) => { // document ready start
//check if running gonative
  if (navigator.userAgent.indexOf('gonative') > -1) {  
    //hide cookie banner
    $(".sqs-cookie-banner-v2.DARK").hide();
    console.log("yes gonative");
  }  else  {
    //show cookie banner
    $('.sqs-cookie-banner-v2.DARK').show();
    console.log($('.sqs-cookie-banner-v2.DARK').attr('style'));
    console.log("no gonative");
 }
    } ); // document ready end
</script>

The second thing I notice is it appears you are looking for an element on the page with a class of .sqs-cookie-banner-v2 I do not find an element on the page with that class. If there is no element, then the code won't work.