Result

jQuery

$(function(){
    $(".open").click(function(){
        $(this).next(".slideContent").slideToggle("slow");
    });
});

css

.open {
    background-color: #FFCC33;
    padding: 8px;
    margin-bottom: 10px;
    cursor: pointer;
}
.slideContent {
    display: none;
    border: 1px solid #ccc;
    margin-bottom: 10px;
    padding: 10px;
}

.slideContentはdisplay: none;としておきます。あとは見た目の調整です。
.openでcursor: pointer;しておくと親切だと思います。

HTML

<div class=&quot;slideBox&quot;>
    <div class=&quot;open&quot;>
        ここをクリックするとスライドして開きます。
    </div>
    <div class=&quot;slideContent&quot;>
        コンテンツをここに記述します。<br>
        もちろんHTMLを記述できるので何だって表現できます。<br>
        もう一度クリックするとスライドを閉じます。
    </div>
</div>