title: PHP - Hide Element Only On Home Page - WordPress Site
body: <p>In my <code>footer.php</code> file, I have this bit of code towards the end of the file:</p>
  
  <pre><code>&lt;?php wp_footer(); ?&gt; 
  
  &lt;div class="website-by"&gt;
  &lt;br&gt;
  Website by &lt;a href="https://gatewaywebdesign.com/" target="blank"&gt;Gateway Web Design&lt;/a&gt;
  &lt;/div&gt;
  
  &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>As you can see, I've created a "website by" link, which links to another website when clicked on. </p>
  
  <p>But I don't want this text, or the div that contains it, to appear at all on the home page of the site:</p>
  
  <p><a href="https://thehamburgercollection.com/" rel="nofollow noreferrer">https://thehamburgercollection.com/</a></p>
  
  <p>I've checked other stackoverflow articles that suggest doing so with <a href="https://stackoverflow.com/questions/43705970/hide-div-on-specific-url-with-css-or-js">JQuery</a>, which I've added to my <code>scripts.js</code> file:</p>
  
  <pre><code>//hide link on the home page
  document.ready(function() {
      if (window.location.href.indexOf('https://thehamburgercollection.com/')) {
        //Hide the element.
        jQuery('.website-by').hide();
      }
    });
  </code></pre>
  
  <p>And I've also tried hiding the div on the home page with CSS that was <a href="https://stackoverflow.com/questions/21524782/how-to-hide-menu-only-on-home-page-wordpress">suggested here</a>:</p>
  
  <pre><code>.home .website-by {
      display: none;
  }
  </code></pre>
  
  <p>But unfortunately neither of these methods have worked. I've declared my class as <code>website-by</code> in the <code>footer.php</code> file, and have added the JQuery that should target that class in the <code>scripts.js</code> file, and have also added the suggested CSS. Any idea why either the JQuery or CSS code isn't working?</p>
  
  <p>This is a WordPress website and a custom there. Any help / suggestions / education is appreciated!</p>