文字に動きのあるサイトを作りたい

前提・実現したいこと

表題の通り、fvが読み込まれたとき、文字にタイピングのような動きを出したい。

発生している問題・エラーメッセージ

試したこと

動き
上記のサイトを見ながら作成しました。
少しアレンジを加え、fvが開いたら（認証したら）、文字に動きを入れるようにしたいので
if構文を使って下記のJsを書きました。文法なども見て確認したものの、エラーが出たりしてうまくいかなかったので、質問しました。

 if($(fixFv).onload = function() {

これがelse含めて、終わったら、「　）」を使って終了させる認識を持っていますが、
エラーを解消するには　elseの前に);を入れると解消されます。私の認識が間違えていますか？
それとも、ほかの部分が間違えていますか？

該当のソースコード

HTML
<!DOCTYPE html>
<html>
<head>
	<title></title>
   <link rel="stylesheet" href="asset/css/destyle.css">
    <link rel="stylesheet" href="asset/css/style.css">
<script src="./asserts/js/jquery-3.6.0.min.js"></script>
   <script src="./asserts/js/script.js"></script>

</head>
<body>
	<section class="fv">
		<div class="fv-inner">
			<ul class="fv-list" id="slide_wrap">
				<!-- <li class="fv_item"><img src="./asserts/img/fv/fv-pc (1).jpg" alt=""></li><!== /.fv-item -->
				<!-- <li class="fv_item"><img src="./" alt=""></li>/.fv-item -->
				<!-- <li class="fv_item"><img src="./asserts/img/fv/fv-code.png" alt=""></li>/.fv-item -->
				<li class="fv_item"><img alt="" src="./asserts/img/fv/web%20era_natural.png"></li><!-- /.fv_item -->
			</ul><!-- /.fv-list -->
			<h2 class="fv-txt"></h2>
			<p class="fv-txt1 TextTyping"><span>〇</span><span>〇</span><span>〇</span></p><span>〇</span>代<span>〇</span> <span>〇</span><span>〇</span><span>〇</span><span>〇</span><span>〇</span><span>〇</span><span>〇</span> <span>〇</span> <span>Sit〇</span> <span>〇</span> <!-- <br class="fv-txt2"> -->
			 <!-- /.fv-txt -->
		</div><!-- /.fv-inner -->
	</section><!-- /.fv -->
</body>
</html>

CSS

.fv {
  position: relative;
  overflow: hidden;
  width: 100%;
}

@media screen and (min-width: 600px) and (max-width: 1024px) {
  .fv {
    margin-top: 0px;
    padding: 0px 3%;
  }
}

@media screen and (max-width: 599px) {
  .fv {
    margin-top: 0px;
    padding: 0px 5%;
  }
}

.fv-inner {
  position: relative;
}

.fv-txt {
  position: absolute;
  top: 50%;
  left: 25%;
  -webkit-transform: translate(-40%, -40%);
          transform: translate(-40%, -40%);
  /* white-space: nowrap; */
  color: lightcyan;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  font-size: 2.5em;
}

.fv-txt span {
  letter-spacing: 2rem;
}

.TextTyping span {
  display: none;
}

.TextTyping::after {
  content: "|";
  -webkit-animation: typinganime .8s ease infinite;
          animation: typinganime .8s ease infinite;
}

@-webkit-keyframes typinganime {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes typinganime {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

JS

function TextTypingAnime() {
  $('.TextTyping').each(function() {
    var fix =$('.fv')
    var fixFv =fix.offset().top
    var thisChild = "";
     if($(fixFv).onload = function() {
         thisChild = $(this).children();  // spanタグを取得
         // spanタグ1つ1つ要素の処理を追加
         thisChild.each(function (){
             var time = 100;
             // 時差で表示する際のdelayを指定しその時間後にFadeIn
             $(this).delay(time * i).fadeIn(time);
         });
     } else {
      thisChild = $(this).children();
      thisChild.each(function (i) {
        $(this).stop(); //delay処理を止める
        $(this).css("display", "none"); //spanタグ非表示
      });
    });
 });
 
}