Use .slideToggle() method with jQuery 3.0

jQuery 3.0 で .slideToggle() を使用して要素の表示・非表示を操作する例です。

HTML

<div id="test">
<p>テストです。</p>
</div><!-- /#test -->

<div>
<button id="btn-01">SlideDown / SlideUp</button>
</div>

CSS

p{
	margin: 0;
}

#test{
	margin-bottom: 20px;
	width: 200px;
	height: 150px;
	background-color: #efefef;
}

JavaScript

(function ($) {
    $("#test").hide();    // CSSではなく、ここで非表示にする。

    $("#btn-01").on("click", function () {
        $("#test").slideToggle();
    });
}(jQuery));