Поочередное выцветание элементов.
 

Привет.
Есть неcколько div, у которых style = "display: none;" , при нажатии на соответствующие кнопки, они появляются. Как сделать так, чтобы при нажатии на следующую кнопку, предыдущий div исчезал? Заранее спасибо.

<biv>
    <button onclick="$('#div1').fadeIn()"> div1 </button>
    <button onclick="$('#div2').fadeIn()"> div2 </button>
    <button onclick="$('#div3').fadeIn()"> div3 </button>
</biv>

<div id="div1" style = "display: none;"></div>
<div id="div2" style = "display: none;"></div>
<div id="div2" style = "display: none;"></div>

А это что еще за элемент? Или я не успеваю следить за HTML5 нововведениями?
На манер текущего твоего кода:

<biv>
    <button onclick="$('#div1').fadeIn()"> div1 </button>
    <button onclick="$('#div1').fadeOut();$('#div2').fadeIn()"> div2 </button>
    <button onclick="$('#div2').fadeOut();$('#div3').fadeIn()"> div3 </button>
</biv>
 
<div id="div1" style = "display: none;"></div>
<div id="div2" style = "display: none;"></div>
<div id="div2" style = "display: none;"></div>

Спасибо за ответ, danik.js.
Ну да, конечно же я опечатался :) А что если div будет не 3 а больше и нажимаем не на первый, второй и третий по очереди, а в любом порядке.
Кроме как то что я сделал, как-нибудь по-грамотнее делают?

<div>
    <button onclick="$('.menu ').fadeOut().delay(500);$('.div1').fadeIn()"> div1 </button>
    <button onclick="$('.menu ').fadeOut().delay(500);$('.div2').fadeIn()"> div2 </button>
    <button onclick="$('.menu ').fadeOut().delay(500);$('.div3').fadeIn()"> div3 </button>
</div>
  

<div class = "menu div1" style = "display: none;"></div>
<div class = "menu div2" style = "display: none;"></div>
<div class = "menu div2" style = "display: none;"></div>

Думаю, грамотнее будет добавить :visible

<button onclick="$('.menu:visible').fadeOut().delay(500);$('.div1').fadeIn()"> div1 </button>

чтобы команда растворения применялась только к видимому div'у