如何在每次点击时播放相同的光斑动画？

<div id="animation"></div>
<button id="btn">点击播放动画</button>

#animation {
  width: 100px;
  height: 100px;
  background-color: yellow;
  animation: sparkle 1s infinite;
}

@keyframes sparkle {
  0% { opacity: 1; }
  50% { opacity: 0.5; }
  100% { opacity: 1; }
}

var animationElement = document.getElementById('animation');
var btnElement = document.getElementById('btn');

btnElement.addEventListener('click', function() {
  animationElement.classList.remove('play-animation');
  void animationElement.offsetWidth; // 强制重绘，以便重新触发动画
  animationElement.classList.add('play-animation');
});