JSFiddle - React, Tailwind, and code Playground

HTML

<div class="toTop"><button>top</button></div>
<div>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a test</span>
    <br/>
    <span class="sp">This is a...

CSS

.toTop{
    position: fixed;
    float: left;
    width: 100%;
    margin: 0 auto;
}

JavaScript

$(document).ready(function(){

        $(".toTop").hide();

        $(function () {
            $(window).scroll(function () {
                if ($(this).scrollTop() > 200) {
                    $('.toTop').fadeIn();
                } else {
                    $('.toTop').fadeOut();
                }
            });        
        });        
    });

var easing, e, pos;
    $(function(){
      $(".toTop").on("click", function(){
        pos= $(window).scrollTop();
        $("body").css({
          "margin-top": -pos+"px",
          "overflow-y": "scroll", 
        });
        $(window).scrollTop(0);
        $("body").css("transition", "all 1s ease");
        $("body").css("margin-top", "0");
        $("body").on("webkitTransitionEnd transitionend msTransitionEnd oTransitionEnd", function(){
          $("body").css("transition", "none");
        });
      });
    });