title: use jquery to show/hide a div based on link href
body: <p>I currently have part of this working: </p>
  
  <pre><code>$('#marketing_button').click(function() {
          $('#marketing').fadeIn('slow', function() {
          // Animation complete
          });
      });
  </code></pre>
  
  <p>If I click a element with id marketing_button, then it will show the marketing div.</p>
  
  <p>I am setting up a basic show/hide for a set of divs and buttons.  I have 5 hrefs and 5 divs.  Each href has its own id, but I feel like there is a easier way to do this than copying this code 5 times.</p>
  
  <p>Also I need to hide the other divs when a new one is clicked.</p>
  
  <p>structure looks like:</p>
  
  <pre><code>&lt;a href="marketing" id="marketing_button"&gt;MArketing&lt;/a&gt;
  &lt;a href="processing" id="processing_button"&gt;Processing&lt;/a&gt;
  &lt;a href="compliance" id="compliance_button"&gt;Compliance&lt;/a&gt;
  ...
  &lt;div id="services"&gt;
  &lt;div id"marketing"&gt;&lt;/div&gt;
  &lt;div id"processing"&gt;&lt;/div&gt;
  &lt;div id"compliance"&gt;&lt;/div&gt;
  ...
  &lt;/div&gt;
  </code></pre>
  
  <p>So here are the specific questions:  how do I access the href so that I don't need to repeat the code 5 times,</p>
  
  <p>how do I close the visible div and fade in the new one?</p>