title: All anchors within div fade except what's been clicked
body: <p><a href="http://liveweave.com/Y5JRdE" rel="nofollow">http://liveweave.com/Y5JRdE</a></p>
  
  <p>I have 3 buttons in the navbar, select, div, and text. When I click the select button I want all the other divs to animate at 60% opacity except select.
  When click it again I want no change specified unless I click an anchor and switch it for example.</p>
  
  <p>It kind of works but it's poor coding, I tried doing this with radio buttons but was having trouble triggering it from a button click, and getting it to show properly in the navigation bar so I'm trying to apply a similar concept to the navbar with anchors instead of defying when an element is checked.</p>
  
  <p><strong>JQuery/JavaScript</strong>:</p>
  
  <pre><code>$('#tools a').click(function() {
      $('#tools a').animate({
          "opacity": "0.6"
      });
  
      $(this).animate({
          "opacity": "1"
      });
  });
  </code></pre>
  
  <p><strong>HTML</strong>:</p>
  
  <pre><code>&lt;div class='header' data-role='header'&gt;
      &lt;div id='tools' align='center'&gt;
          &lt;a id='select' data-role='button' data-inline='true' data-mini='true'&gt;Select&lt;/a&gt;
          &lt;a id='gen1' data-role='button' data-inline='true' data-mini='true'&gt;Button&lt;/a&gt;
          &lt;a id='gen2' data-role='button' data-inline='true' data-mini='true'&gt;Anchor&lt;/a&gt;
      &lt;/div&gt;
  
      &lt;h1 style='visibility:hidden; width:0; height:0; margin:0;'&gt;NULL&lt;/h1&gt;
  &lt;/div&gt;
  </code></pre>