Now the only thing left to do is actually scroll a user when necessary. That's going to happen over inside our if statement, we can remove our console.log('Should scroll') call and we're going to replace it with a call to messages.scrollTop, which is the jQuery method for setting that scrollTop value, and we're going to set it to the scrollHeight, which is the total height of the container. This means that we're going to be moving to the bottom of the messages area:

if(clientHeight + scrollTop + newMessageHeight + lastMessageHeight >= scrollHeight) {
  messages.scrollTop(scrollHeight);
}

Over inside Google Chrome, we can now refresh the page to grab that latest index.js file, and I'm just going to hold the enter key for a little bit. As you can see we are scrolling down the list automatically. If I add a new message, it'll show up correctly.

If I'm up near the top and a new message comes in, like 123, I am not going to scroll down the list, which is correct. Now if I'm not quite at the bottom but I'm pretty close, and a new message comes in, I am scrolled to the bottom. But if I'm a little past that last message, we're not going to get scrolled to the bottom which is exactly what we wanted. This is all happening because of our calculations.