title: How to auto scroll down to list while messages are coming
body: <p>Hello Everybody I have a div which lists messages with <code>&lt;ul&gt;</code> here is the code ;</p>
  
  <pre><code>  &lt;section class="portfolio-section masonry-style"&gt;
      &lt;div class="container"&gt;
          &lt;h2&gt;TOPLU KONUŞMA&lt;/h2&gt;
          &lt;div class="container" style="max-height:500px;min-height:500px;overflow-y: scroll;overflow-x: hidden;"&gt;
              &lt;br /&gt;
              &lt;input type="hidden" id="displayname" /&gt;
              &lt;ul id="discussion"&gt;&lt;/ul&gt;
          &lt;/div&gt;
          &lt;/div&gt;  
  
  &lt;/section&gt;
  &lt;div class="container"&gt;
      &lt;div class="container"&gt;
          &lt;div id="contact-form"&gt;
              &lt;textarea name="comment" id="message" placeholder="Mesajınız"&gt;&lt;/textarea&gt;
              &lt;div class="submit-area"&gt;
                  &lt;input type="submit" id="sendmessage" value="Gönder"&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
      &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/MHK5I.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/MHK5I.png" alt="enter image description here"></a></p>
  
  <p>script ;</p>
  
  <pre><code>    &lt;script src="~/Scripts/jquery.signalR-2.2.0.min.js"&gt;&lt;/script&gt;
      &lt;!--Reference the autogenerated SignalR hub script. --&gt;
      &lt;script src="~/signalr/hubs"&gt;&lt;/script&gt;
      &lt;!--SignalR script to update the chat page and send messages.--&gt;
      &lt;script&gt;
          $(function () {
              var currentMember = '@Html.Raw(@ViewBag.Name)';
              // Reference the auto-generated proxy for the hub.
              var chat = $.connection.chatHub;
              // Create a function that the hub can call back to display messages.
              chat.client.addNewMessageToPage = function (name, message) {
                  // Add the message to the page.
                  $('#discussion').append('&lt;li&gt;&lt;strong&gt;' + htmlEncode(name)
                      + '&lt;/strong&gt;: ' + htmlEncode(message) + '&lt;/li&gt;');
              };
  
              // Get the user name and store it to prepend to messages.
              $('#displayname').val(currentMember);
              // Set initial focus to message input box.
              $('#message').focus();
              // Start the connection.
              $.connection.hub.start().done(function () {
                  $('#sendmessage').click(function () {
                      // Call the Send method on the hub.
                      chat.server.send($('#displayname').val(), $('#message').val());
                      // Clear text box and reset focus for next comment.
                      $('#message').val('').focus();
                  });
              });
          });
          // This optional function html-encodes messages for display in the page.
          function htmlEncode(value) {
              var encodedValue = $('&lt;div /&gt;').text(value).html();
              return encodedValue;
          }
      &lt;/script&gt;
  </code></pre>
  
  <p>so As you see it doesnt auto scroll down while messages are coming. this is real time chat. So how can I autoscroll down while messages are coming</p>