jQueryを使ったスクロールで表示されるページトップへ戻るボタンの作り方

実現したいこと

掲題通りにページトップボタンをクリックすることで上部へスクロールしてページトップに戻るように作成したい。
以下の模写元サイトを参考にして作成しています。
模写元サイトのボタンは矢印ですが、「PAGE TOP」にしていて作成しています。
https://www.delights-home.jp/

前提

ページボタンを作成し、jQueryに
・const pageTop = "#page-top";の#page-topはHTMLで書いたid名で入れています。
・if ($(this).scrollTop() > 100)の100はどのくらいスクロールしたら表示するか設定（単位はpx）
・最後の500は何ミリ秒かけてページトップに戻るか設定
上記の通りに設定はしましたが、ボタン押下後スクロールされず、一瞬でページトップに戻ってしまいます。

index.php

<div id="page-top"> <a href="">PAGE TOP</a> </div>

CSS

#page-top { position: relative; margin-top: 70px; text-align: right; } #page-top a { background-color: #1cb4d3; bottom: 0; color: #fff; padding: 20px; }

JS

$(function () { const pageTop = $('#page-top'); pageTop.hide(); // 最初はボタンを非表示にする $(window).scroll(function () { if ($(this).scrollTop() > 100) { // 100pxスクロールしたら表示 pageTop.fadeIn(); // 100px以上スクロールしたらボタンをフェードイン } else { pageTop.fadeOut(); // 100px以下になったらボタンをフェードアウト } }); pageTop.click(function () { $('body,html').animate( { scrollTop: 0, // 上から0pxの位置に戻る }, 500 // 500ミリ秒かけて戻る ); return false; }); });

試したこと

ここに問題に対して試したことを記載してください。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。