title: How to reset CSS webkit animation?
body: <p>I add and remove my class accordingly but for some reason the animation will not reset in Firefox browser. </p>
  
  <p>It seems to me that the animation on before and after is not resetting, so it won't start again.</p>
  
  <p>Does anyone know how I might fix this?
  Codepen: <a href="http://codepen.io/anon/pen/zBRVjq" rel="nofollow">http://codepen.io/anon/pen/zBRVjq</a></p>
  
  <pre><code>window.onload = init;
  
  function init() {
    document.getElementById("sendDoxm").onclick = addMyClass;
  }
  
  function addMyClass() {
    var classString = this.className;
    var newClass = classString.concat(" clicked"); 
    this.className = newClass; 
  
    window.setTimeout(function () {
    document.querySelector("#sendDoxm").classList.remove("clicked")
  
      }, 2500);
  }
  </code></pre>
  
  <p>Problem only occurs in Firefox</p>