单击事件Javascript中的If语句

我是Jquery的新手，我正在处理一个由红色圆点样式的列表项组成的网格。我这样做是为了，当你把鼠标悬停在其中一个点上时，它会被赋予一个类，该类带有一个动画，该动画会增长特定的点

班级

.twoHover{
transform-origin: center;
animation: makeDotsBig 1s forwards;
}
@keyframes makeDotsBig {
  0%{
    -webkit-transform: scale(1);
  }
  100%{
    -webkit-transform: scale(3);
  }
}

JS

var numDots = 0;
$("li").on('mouseover', function(event){
    event.preventDefault();
    $(this).addClass("twoHover");
    numDots++;
})

我现在的问题是，一旦所有的点都展开，我想触发一个动画，使它们都在页面上以相同的重叠动画。我已经用控制台记录“numDots”的点击事件对其进行了测试，鼠标悬停成功地添加到数字中，但无论我尝试哪种类型的if、while或for循环，我似乎都无法在“numDots”达到我想要的数字（本例中为25）后触发动画

---

如果有人能为我找到正确的解决方案，我将不胜感激

在单击事件中不能触发动画是什么意思？你到底在哪一部分遇到问题？你能说得更具体些吗？问题不清楚。你是用标记名绑定的，标记名选择器总是会给你一个数组。因此，您的页面中可能有25个li。我的点网格包含25个单独的列表项。我试图使它，使您每次悬停在一个li上，它都会触发css动画来转换：缩放，并且它还会向整数“numDots”添加1。到目前为止，我已经成功地做到了这一点。我遇到麻烦的部分是，我不知道如何使第二个动画（所有的点回到屏幕中心）在悬停在所有的点上后触发。我尝试过使用if和while语句以及for循环，但我似乎不知道如何跟踪numdot并在25上触发第二个动画。