$("p:not(:first)").css("display", "none"); $("h3:first").addClass("select"); $("div h3").click(function() { var cont = $(this).next(); if ($(cont).css("display") == "none") { $("p").slideUp("fast"); $(cont).slideDown("fast"); $("h3").removeClass("select"); $(this).addClass("select"); } }).hover( function() { $(this).addClass("over"); }, function() { $(this).removeClass("over"); });
div{width:250px;margin:25px;} .over , .select{background:yellow;} p{background:#efefef;height:150px;} h3{background:#f7f7f7;cursor:pointer;} p,h3{padding:10px;}
<div> <h3>Panel 01</h3> <p>content<br>content<br>content<br>content<br>content<br>content<br></p> <h3>Panel 02</h3> <p>content<br>content<br>content<br>content<br>content<br>content<br>content<br></p> <h3>Panel 03</h3> <p>content<br>content<Runbr>content<br>content<br></p> </div>