title: jQuery Toggle Div Switcher
body: <p>I'm trying to build an FAQ page. The page will have 2 columns: first column will have list of questions, second column will have the answers.</p>
  
  <p>Essentially I'd like to hide the answer column and when a question is clicked, it will fade in. When another question is clicked, the old answer will fade out and the new answer fades in. So I guess a toggle/switch effect?</p>
  
  <p>Here is the structure of my html output from Drupal:</p>
  
  <pre><code>&lt;!-- Question column --&gt;
  
  &lt;div id="question&gt;
  
       &lt;div class="views-row views-row-1"&gt;
            &lt;div class="question"&gt;Question 1 Here!&lt;/div&gt;
       &lt;/div&gt;
  
       &lt;div class="views-row views-row-2"&gt;
            &lt;div class="question&gt;Question 2 Here!&lt;/div&gt;
       &lt;/div&gt;
  
        &lt;div class="views-row views-row-3"&gt;
            &lt;div class="question&gt;Question 3 Here!&lt;/div&gt;
       &lt;/div&gt;
  
  &lt;/div&gt;
  
  
  &lt;!-- Answer column --&gt;
  
  &lt;div id="answer&gt;
  
       &lt;div class="views-row views-row-1"&gt;
            &lt;div class="answer"&gt;Answer 1 Here!&lt;/div&gt;
       &lt;/div&gt;
  
       &lt;div class="views-row views-row-2"&gt;
            &lt;div class="answer&gt;Answer 2 Here!&lt;/div&gt;
       &lt;/div&gt;
  
        &lt;div class="views-row views-row-3"&gt;
            &lt;div class="answer&gt;Answer 3 Here!&lt;/div&gt;
       &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>Now here's what I managed to do so far. I've managed to make the first question toggle on/off itself with an animated fade effect. When it comes to hiding other divs to show a new div, I'm lost. Could you help tweak my jQuery plugin?</p>
  
  <pre><code>      jQuery.fn.fadeToggle = function(speed, easing, callback) {
  
        return this.animate({opacity: 'toggle'}, speed, easing, callback);  
  
        };
  
  
  
  $(document).ready(function() {
  
    $("#answer .views-row").hide();
  
    $("#question .views-row-1").click(function(){
  
    $("#answer .views-row-1").fadeToggle("slow");
  
    });
  
    });
  </code></pre>
  
  <p>Very much appreciated for any help!
  Cheers.</p>