Fade-in Fade-out doesn’t work in WordPress

I have back-to-top script with an arrow icon which appears when scrolling down and disappears when the page content is on top. Works perfect, but when I insert the script in WordPress the scrollTop part of the script works but not the fade-in and fade-out effect.

Any solution?

jQuery('body').prepend('<a href="#" class="back-to-top">Back to Top</a>');
var amountScrolled = 300;
$(window).scroll(function() {
    if ( $(window).scrollTop() > amountScrolled ) {
        $('a.back-to-top').fadeIn('slow');
    } else {
        $('a.back-to-top').fadeOut('slow');
    }
});

$('a.back-to-top, a.simple-back-to-top').click(function() {
    $('html, body').animate({
        scrollTop: 0
    }, 700);
    return false;
});
body {background:#FEF1D4; height:1000px}

.back-to-top {
    display: none;
    width: 4.75rem;
    height: 4.75rem;
    text-indent: -9999px;
    position: fixed;
    z-index: 1500;
    left: 0.5rem;
    bottom: 1rem;
    background: url(https://static.thenounproject.com/png/1920879-200.png) no-repeat center 43%;
    background-size: contain;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

This is the WordPress result:

enter image description here

Go to Source
Author: Danielillo