向下滚动按钮

我已经创建了#scrolldownbutton滚动到第一个组件，但我最初想做的是，当按钮被点击页面滚动在视口和停止部分可见的组件在视图端口的底部，其中按钮应该出现在可见组件的顶部和每次按钮被点击的视口底部。

这是我到目前为止，请如果有人可以帮助这将是惊人的。

$(document).ready(function() {
    $("#scrollmorebutton").on("click", function() {
      console.log("scrollmorebutton was clicked");
  //jquery smooth scroll code here
      $('html, body').animate({
        scrollTop: $("h2:contains('New Programs')").offset().top
      }, 2000);
    });
});