title: Show Or Hide Div Based On CSS Class
body: <p>I am trying to show or hide a div called "contact-form" on website based on another divs a css class, which is connected to whether a product is in or out of stock.</p>
  
  <p>It needs to show the div if the class is "in-stock", and hide if it's class is "out-of-stock"</p>
  
  <p>any ideas? struggling to figure it out!</p>
  
  <pre><code>&lt;div id="contact-form"&gt;&lt;/div&gt;
  
  &lt;p class="stock in-stock"&gt;&lt;/p&gt; &lt;!-- if product is in stock this shows--&gt;
  
  &lt;p class="stock out-of-stock"&gt;&lt;/p&gt; &lt;!-- if out of stock this show--&gt;
  
  &lt;script&gt;
  
      if ('p.in-stock') {
          ('#contact-form').show();   
      }
      else {
          ('#contact-form').hide();
      }
  
  &lt;/script&gt;
  </code></pre>
  
  <p>Website is here - <a href="http://trent-art.co.uk/shop/barnes-david-still-life-of-flowers/" rel="nofollow">http://trent-art.co.uk/shop/barnes-david-still-life-of-flowers/</a> - out of stock product which needs the "submit best offer" button hiding if out of stock.</p>