Как добавить анимацию плавного дораскрытия блока?

Есть блок с такой структурой

<div class="tabs-content tabs-content-one">
   <div class="tabs-content-one-content tab-content details-tabs-deacription" >
          Много текстааааааааааа Много текстааааааааааа Много текстааааааааааа Много текстааааааааааа Много текстааааааааааа Много текстааааааааааа Много текстааааааааааа Много текстааааааааааа Много текстааааааааааа
          <div class="open-hidden-text">
              <a class="open-tab" href="#"></a>
          </div>
   </div>
</div>

По умолчанию высота блока tabs-content-one-content 500px,и по нажатию на open-hidden-text блок дораскрывается до конца,и при повторном нажатии закрывается до тех же 500px.Как сделать то же самое но плавно? SlideToggle срабатывает не правильно,закрывая весь блок

$(document).ready(function () {
    $(".tabs .tabs-content .tabs-content-one-content").each(function (index) {
        if ($(this).height() > 500) {
            $(this).addClass("tabs-content-one-content-height");
        }
        $(this).children(".open-hidden-text").click(function () {
           $(this).parent().toggleClass('open-hidden-text-open');
            return false; 
        });
    });
});