JSFiddle - React, Tailwind, and code Playground

HTML

<a class="arrow" href="#">        
    <img class="arrow-img rotate2" src="http://icons.iconarchive.com/icons/icons8/windows-8/128/Arrows-Up-Circular-icon.png" />        
</a>

CSS

.rotate {
    transform: rotate(-180deg);
    /*transform: rotate(180deg);*/
    transition: .3s;
}
.rotate2 {
    transform: rotate(0deg);
    transition: .3s;
}

JavaScript

$('.arrow').on("click", function (event) {
    $('.arrow-img').toggleClass('rotate');
    $('.arrow-img').toggleClass('rotate2');
});