What's the most efficient jQuery way to check/toggle fading of three elements?
<p>I've got three sidebar buttons. On a click event, each opens a previously hidden div:</p>

<pre><code>//Contribute Sidebar Actions
      $('#contributePod .facebookBtn, #contributeFacebook .close').click(function() {
          $('#contributeFacebook').fadeToggle('slow', function() {
        });
      });

      $('#contributePod .twitterBtn, #contributeTwitter .close').click(function() {
          $('#contributeTwitter').fadeToggle('slow', function() {
        });
      });

      $('#contributePod .flickrBtn, #contributeFlickr .close').click(function() {
          $('#contributeFlickr').fadeToggle('slow', function() {
        });
      });
</code></pre>

<p>Here is the HTML portion</p>

<pre><code>&lt;div id="contributePod"&gt;
            &lt;h2&gt;Contribute&lt;/h2&gt;
            &lt;a class="facebookBtn" href="#" title="Contribute on Facebook"&gt;&lt;/a&gt;
            &lt;a class="twitterBtn" href="#" title="Contribute on Twitter"&gt;&lt;/a&gt;
            &lt;a class="flickrBtn" href="#" title="Contribute on Flickr"&gt;&lt;/a&gt;
        &lt;/div&gt;


        &lt;div class="contributeContainer" id="contributeFacebook"&gt;
            &lt;a class="close" href="#"&gt;X&lt;/a&gt;
            &lt;h2&gt;Contribute on Facebook&lt;/h2&gt;

            &lt;p&gt;
                Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
            &lt;/p&gt;

            &lt;form method="post" action="" id="facebookForm" name="facebook_form"&gt;
                &lt;label&gt;Comment&lt;/label&gt;
                &lt;textarea name="facebookComment" rows="1" cols="1"&gt;&lt;/textarea&gt;
                &lt;input class="contribSubmit btn" type="submit" value="Share" /&gt;
            &lt;/form&gt;
        &lt;/div&gt; 

        &lt;div class="contributeContainer" id="contributeTwitter"&gt;
            &lt;a class="close" href="#"&gt;X&lt;/a&gt;
            &lt;h2&gt;Contribute on Twitter&lt;/h2&gt;

            &lt;p&gt;
                Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
            &lt;/p&gt;

            &lt;form method="post" action="" id="twitterForm" name="twitter_form"&gt;
                &lt;label&gt;Comment&lt;/label&gt;
                &lt;textarea name="twitterComment" rows="1" cols="1"&gt;&lt;/textarea&gt;
                &lt;input class="contribSubmit btn" type="submit" value="Share" /&gt;
            &lt;/form&gt;
        &lt;/div&gt; 

        &lt;div class="contributeContainer" id="contributeFlickr"&gt;
            &lt;a class="close" href="#"&gt;X&lt;/a&gt;
            &lt;h2&gt;Contribute on Flickr&lt;/h2&gt;

            &lt;p&gt;
                Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
            &lt;/p&gt;

            &lt;form method="post" action="" id="flickrForm" name="flickr_form"&gt;
                &lt;input class="btn" type="file" /&gt;
            &lt;/form&gt;
        &lt;/div&gt;
</code></pre>

<p>1) Is the way I'm doing that the most efficient?</p>

<p>2) What would I add to make it so that if one of the divs is toggled on, and a user clicks to toggle a second, that it fades out the first opened one before showing the second div?</p>
