I want to auto-scroll my timeline to the bottom. I tried jQuery but that didn't worked I am using bootstrap's scroll-area-lg class for creating a scroll area.

My Code -

 <div id="autoScrollArea" class="scroll-area-lg" style="height: 70vh;">
  <div class="scrollbar-container" >
  <div>
  <div class="col-md-12 text-center">
  <fieldset class="position-relative form-group">
  <p class="font-weight-bold">Question 1 <span class="text-danger">*</span></p>
  </fieldset>
  </div>
  <div class="col-md-12 text-center">
  <fieldset class="position-relative form-group">
  <p class="font-weight-bold">Question 2 <span class="text-danger">*</span></p>
  </fieldset>
  </div>
  <div class="col-md-12 text-center">
  <fieldset class="position-relative form-group">
  <p class="font-weight-bold">Question 3 <span class="text-danger">*</span></p>
  </fieldset>
  </div>
  <div class="col-md-12 text-center">
  <fieldset class="position-relative form-group">
  <p class="font-weight-bold">Question 4 <span class="text-danger">*</span></p>
  </fieldset>
  </div>
  <button class="btn btn-primary" id="submitButton"  ng-click="submit()" ng-if="showOnSubmit">Submit</button>
  </div>
  </div>
  </div>
 </div>

 <button class="btn btn-primary" ng-click="scrollBottom()">Scroll Bottom</button>
    
<script>
 $scope.scrollBottom=()=>{
 var questionScrollSectionHeight = $('#questionScrollSection').height();
 //get scroll height
 var scrollHeight = $('#questionScrollSection').scrollTop() + questionScrollSectionHeight;
 console.log('scrollHeight', scrollHeight); //getting height
           
 $('#questionScrollSection').animate({
     scrollTop: scrollHeight
 }, 1000);
 
//focus on submit button
  $('#submitButton').focus();
 }
</script>

I am getting the height but the area is not scrolling. I am also not getting any errors on the console.