title: If Element ID exists then Hide Other Element
body: <p>I have an ecommerce website that has multiple prices for a given item. I am trying to set up a bit of script that will hide a price, if the lower price class is present on the page.</p>
  
  <pre><code>&lt;table&gt;
      &lt;tbody&gt;
          &lt;tr&gt;
              &lt;td&gt;
                  &lt;font&gt;
                      &lt;div class="product_listprice"&gt;199.99&lt;/div&gt;
                  &lt;/font&gt;
                  &lt;font&gt;
                      &lt;div class="product_productprice"&gt;179.99&lt;/div&gt;
                  &lt;/font&gt;
                  &lt;b&gt;
                      &lt;div class="product_saleprice"&gt;159.99&lt;/div&gt;
                  &lt;/b&gt;
                  &lt;font&gt;
                      &lt;div class="product_discountprice"&gt;139.99&lt;/div&gt;
                  &lt;/font&gt;
              &lt;/td&gt;
          &lt;/tr&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>Essentially what I need is a script that will hide .product_productprice if .product_saleprice exists on the page, and will hide both .product_saleprice and .product_productprice if .product_discountprice exists.</p>
  
  <p>Here's what I've come up with so far with some google digging.</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      $(document).ready(function(){
          if ( $(".product_discountprice").size() )
          $(".product_saleprice, .product_productprice").hide();
          });
      });   
  &lt;/script&gt;
  </code></pre>
  
  <p>However, it doesn't seem to be working. Any ideas? I'm a jquery novice, so I'm sure there is a better way to do this out there...</p>