javascript - 私が提供した JavaScript の具体的な問題点は何ですか?

Question

私は JavaScript にはかなり慣れていませんが、フロントエンド開発全体の経験はあります。提供されたリストを JS で反復処理し、サイトに結果を表示しようとしています。リスト内の次の項目に移動する前に、各項目が 1 回表示されます。最後に到達すると、最後の項目が永続的に表示されます。Textillate JS ライブラリを使用しています。

コードの何が問題になっていますか?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script>
var title-transitions = [
    "Create Solutions",
    "Build Relationships",
    "Design Brands",
    "Redifine Excellence"
    ],

    transitionCounter = 0,
    looped = false,
    textillateSettings ={
      loop:false,
      in:{
        callback:fucntion(){
          if(!looped) $('h1.introduction-heading').fadeOut(3800);
        }
      }
    };

var $h1 = $('h1.introduction-heading');
$h1.introduction-heading(textillateSettings);

var animationHero = set Interval(function(){
  transitionCounter =
  (transitionCounter == transition.legnth -1)
  ? 0 : transitionCounter + 1;

  if(transitionCounter == 0){
    looped = true;
    clearInterval(animatedHero);
  }

  $('h1.introduction-heading').remove();
  $('h1.introduction-heading')
    .text(transition[transitionCounter])
    .textillate(textillateSettings);

}, 6000);
</script>

参考になれば、 textillate サイトの URL を次に示します。