Cara Membuat Show-Hide Komentar/Expand-Collapse Comment

Tutorial kita kali ini,adalah belajar tentang menghias kotak komentar.
Tapi disini bukan akan membahas bagaimana cara memodifikasi komentar tersebut,melainkan mempelajari script kode menampilkan dan menyembunyikan komentar yang telah ada,hanya dengan satu klik.
.
Gimana? dah ngerti yang saya maksudkan? kali ini kita akan mempelajari lebih dalam bagaimana cara membuat komentar show and hide/expand collaps comment pada blog.

Biar langsung kelar,kita langsung ke topiknya yuk,yuuuk...!

#comments {
display : none;
}
.tombol-komentar a{
text-align: center;
}
.stylewadah {background: #CCC;
padding: 5px;
}

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
    $(&quot;.tombol-komentar&quot;).click(function(){
        $(&quot;#comments&quot;).slideToggle(&quot;slow&quot;);
        $(this).toggleClass(&quot;active&quot;);
        return false;
    });
});
</script>

<center>
<div class='stylewadah'>
<a class='tombol-komentar' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<b:if cond='data:post.numComments == 0'>No Comments be the first<b:else/><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></b:if>
</a>
</div>
</center>

{[['', '']]}