Javascript 仅使用指定关键帧的纯CSS在元素上触发动画

我希望一些动画被触发，只使用纯css点击一个元素。我已经为这个类容器指定了关键帧。有一个标签，所以当我点击这个，容器的动画开始。是否可以不使用jquery？简单地说，单击按钮时，动画将使用指定的关键帧开始

HTML

---

}我知道，如果不使用某种JS将类附加到div元素，就无法触发动画

我只会使用onclick和jquery或vanilla js

<div class="container" onclick="$('.container').addClass('container-anim');">
   <div class="psw align-self-center">
       <a style="color:maroon" href="#reset">Back to log-in page</a> 
   </div>
</div>

---

您可以尝试的一种方法是使用，这将在单击任何元素时播放动画。 因此：

.容器动画：活动{ 动画名称：拉伸； 动画持续时间：1.5s； 动画迭代次数：无限； } @关键帧拉伸{ 0%{transform:scale1；} 50%{ } 100%{transform:scale1.2；} }

---

谢谢你的回答，但是问题中已经提到了一个限制

.container-anim {    
animation-name: stretch;    
animation-duration: 1.5s; 
animation-iteration-count: infinite;

}

@keyframes stretch {
0% {transform: scale(1);}
50%{ }
100%{transform: scale(1.2);}

<div class="container" onclick="$('.container').addClass('container-anim');">
   <div class="psw align-self-center">
       <a style="color:maroon" href="#reset">Back to log-in page</a> 
   </div>
</div>