メッセージ送信した時に最下部までスクロールしたい

Question

簡易チャットアプリの非同期通信を実装しています。
解決したい内容はメッセージ送信時に最下部までスクロールして欲しいです。
そのためにjquery/javascriptを用いてます。
どのサイトを開いても

$('.messages').animate({ scrollTop: $('.messages')[0].scrollHeight});

これでスクロールされると書いてますが、スクロールされないんです。。。
messagesの部分は動かしたい要素名を表していると思うので間違いないかと思います。
ちなみにこちらの記述は

  .done(function(data){
    var html = buildHTML(data);
    $('.messages').append(html); 
    $('.messages').animate({ scrollTop: $('.messages')[0].scrollHeight});
    $('form')[0].reset();
  })

doneの中に記述しています。

一体、何が原因でしょうか？
よろしくお願いします。

Answer 1

もしturbolinksを利用しているのであれば、jqueryが思うように動かない可能性があります。
その場合は、下記のような形で期待通りの動作ができると思います。

$(document).on('turbolinks:load', function() { 
//ここにjqueryを記載する
});