Разбираюсь с jQuery

Вы должны использовать эффект .slideToggle ().

$(document).ready(function() {
    $(".answer").css("display","none");
    $("#maincontent a.animate").click(function() {
        $("#maincontent .answer").slideToggle('slow');
    });
});

попробуйте использовать один метод, например:

 $(selector).one('effect', 'data for effect', callback function);

он гарантирует, что эффект возникает только один раз для каждого элемента.

Во-первых, я бы предложил следующую структуру для ваших часто задаваемых вопросов:

<div id = "faq">
  <div class = "qa" id = "faq_greenandflies">
    <span class = "q">What is <a href = "#faq_greenandflies">green and flies</a></span>
    <div class = "a">
      Super Pickle!
    </div>
  </div>
  <div class = "qa" id = "faq_redandbadforteeth">
    <span class = "q">What is <a href = "#faq_redandbadforteeth">Red and bad for your teeth</a></span>
    <div class = "a">
      a Brick
    </div>
  </div>
  <!--
  More FAQ's here

  -->
</div>

а затем определите свой jQuery следующим образом:

 <script type = "text/javascript">
    $(function(){
  // hide all answers
  $('div#faq .qa .a').hide();

      // bind a click event to all questions
  $('div#faq .qa .q a').bind(
        'click',
        function(e){
          // roll up all of the other answers (See Ex.1)
          $(this).parents('.qa').siblings().children('.a').slideUp();
          // reveal this answer (See Ex.2)
          $(this).parents('.qa').children('.a').slideDown();
          // return true to keep any other click events       
          return true;
        });

      // check location.hash to see if we need to expand one (direct link)
      $(location.hash).find('.q a').click();
    });
</script>

Объяснение:

(Пример 1)

• это - ссылка, по которой щелкнули
• получить элемент, содержащий это и имеющий класс qa (поле, содержащее как вопрос, так и ответ)
• выберите всех его братьев и сестер. (теперь у нас есть все qa как объект jQ)
• скрыть ответы

(Пример 2)

• это - это строка или ссылка, по которой щелкнули
• получить элемент, содержащий это и имеющий класс qa (поле, содержащее как вопрос, так и ответ)
• раскрыть ответ

рабочая демонстрация - это здесь.

Это сделает за вас несколько вещей:

• Если пользователь глубокие ссылки на ответ, ответ раскрывается автоматически
• Если пользователь нажимает на один ответ, все остальные ответы скрываются
• Вы можете дать своим div правильные идентификаторы, что поможет поисковой оптимизации ссылок на отдельные ответы.

Используйте slideToggle (), как сказал Совьют, но просто как совет - вы можете объявить свойство display в фактическом файле CSS вместо того, чтобы объявлять его внутри javascript. jQuery заметит тот факт, что он скрыт в таблице стилей, и по-прежнему будет выполнять соответствующую функцию слайда.

Вы также можете использовать $(".answer").hide();

Вместо установки свойства CSS display. Просто подумал, что дам тебе знать.