Edit in JSFiddle

$('div').on('click', function () {
    $(this).toggleClass('expanded');
});

<div>
    <p>Nam id quam non massa aliquam adipiscing a ac enim. Praesent sem mauris, scelerisque id iaculis ac, varius non tortor. Donec eget arcu ipsum. Nullam ante nibh, consectetur at commodo eu, sodales vitae eros. Proin ac urna justo. Sed nibh tellus, placerat ac rhoncus condimentum, laoreet id massa.</p>
</div>

div {
    width: 16em;
    max-height: 1em;
    height: auto;
    margin: 0 auto;
    background: #eee;
    overflow: hidden;
    cursor: pointer;
    -webkit-transition: max-height 0.6s ease-out;
    -moz-transition: max-height 0.6s ease-out;
    -o-transition: max-height 0.6s ease-out;
    transition: max-height 0.6s ease-out;
}

div p{
    margin: 1em;
}

div.expanded {
    max-height: 20em;
}