JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<div class="body"></div>

<a class="goBottom" href="#bottom">Bottom !</a>

<div id="bottom"></div>

CSS

.body {
  height: 2000px;
  width: 100%;
  border: 2px solid black;
  background-image: url('http://subtlepatterns2015.subtlepatterns.netdna-cdn.com/patterns/ignasi_pattern_s.png');
}

.goBottom {
  position: fixed;
  bottom: 0;
  right: 0;
  margin: 15px;
}

#bottom {
  width: 0;
  height: 0;
}

JavaScript

$('.goBottom').click(function() {
	var target = $("#bottom");
  var duration = 1000;
  
  $('html, body').animate({
    scrollTop: target.offset().top
  }, duration);
  
  return false;
});