как мне анимировать определенную высоту до 100% в jquery

Я хочу иметь небольшой предварительный просмотр содержимого в div, поэтому я сделал его настолько маленьким, что только отображается первая строка. теперь я хочу анимировать это так, что когда вы щелкаете заголовок, div будет иметь высоту 100%, но когда я использую анимацию (height: "100%"), приятного скольжения нет.

<a href="javascript:void(0);" class="show_it">title:</a>
<div>
    content<br>
    content_hidden
</div>

<script>
$('.show_it').click(function() {
  $(this).next("div").animate({
    height: 'auto'
  }, 1000, function() {
  });
});
</script>

<style>
div{
    height:20px;
    overflow:hidden;
}
</style>