html onclick 重置,如何在执行onclick之后重置旋转并使其称为增益

我有一个旋转的箭头图像。点击后，它会刷新验证码。我用一个短的CSS定义了它，并在单击时调用了旋转功能。这些是CSS，HTML和Javascript：

function rotatearrow() {

arrowreload.style.webkitTransform = 'rotate(360deg)';

arrowreload.style.MozTransform  = 'rotate(360deg)';

arrowreload.style.msTransform  = 'rotate(360deg)';

}

function reloadcaptcha() {

//does what's needed and plays perfectly

}

.reload {

max-width: 32px;

height: auto;

transform: rotate(0);

transition: all 0.8s;

}

现在的要点是：首次单击后旋转rotatearrow，然后旋转箭头，但是第一次后再也不会旋转。我究竟做错了什么？我必须对代码进行哪些更改？