Código JavaScript

<script type=”text/javascript”>
$(function(){
$(“.link”).click(function(e) {
e.preventDefault();
$(‘div.panel:visible’).hide();
$(this).next(‘div.panel’).show();
});
});
</script>

Código CSS

<style>
.adiv{
padding:10px;
text-align:center;
background-color:#5BA0C9;
color:white;
border:solid 1px #C9E0ED;
font-weight:bold;
}
.panel{
padding:10px;
background-color:#EFF4FA;
border:solid 1px #C9E0ED;
display:none;
color:black;
font-weight:inherit;
}

.panel.active{
display:block;
}
.running{
display:block;
}
</style>

Código HTML

<div class=”adiv link” id=”div1″>Click to fade 1 boxes</div>
<div id=”#div1″ class=”panel active”>a</div><br/>
<div class=”adiv link” id=”div2″>Click to fade 2 boxes</div>
<div id=”#div1″ class=”panel”>b</div><br/>
<div class=”adiv link” id=”div3″>Click to fade 3 boxes</div>
<div id=”#div1″ class=”panel”>c</div><br/>[/code]