jQueryの応用、開閉式ブロック。

開閉式ディブ、dl=Div List, dt=Div Title, dd=DIv Descriptionによるたっぷ操作。　

// Div list 1
<dl id="panel1">
    // dt1
    <dt>Title 1</dt>
    <dd>Description of letters</dd>
    // dt2
    <dt>Title 2</dt>
    <dd>Description of letters</dd>
</dl>
<script>
// $(document(function(){ の短縮形
$(function(){
    // dd close
    $('#panel1 dd').hide();
    // A dt clicked
    $('#panel1 dt').click(function(){
        // Set d is clicked dt's children of dd
        var d = $('+dd', this);
        if(d.css('display') === 'block'){
            d.slideUp(1000);
        } else {
            d.slideDown(1000);
        }
    });
});

タグ操作だけで特定のdd を閉じたり開いたりする、ためのthisプロパティー。