JQuery Example
Screen shot
when we click heading then box open then click on close button then box close

<html>
<head>
<script src="jquery-3.2.1.min.js"/></script>
<script>
$(document).ready(function(){
$("#heading").click(function(){
$("#content").slideDown();
});
$("#stop").click(function(){
$("#content").slideUp();
});
});
</script>
<style>
#heading {
background-color: #555;
color:#FFFFFF;
padding:10px;
}

#content {
background-color:#CCCCCC;
display: none;
height:100px;
padding:10px;
}
</style>
</head>
<body>
<div id="heading">Container Heading</div>
<div id="content">This is Container Description<button id="stop">Close</button></div>
</body>
</html>

You can download source code here