JSFiddle - React, Tailwind, and code Playground

HTML

<img class="imageToRotate" src="http://3.bp.blogspot.com/-luB94ORNgho/UHwO4URAQoI/AAAAAAAAAME/MS5Jf7ombVo/s1600/facebook%252BMoreBlogTools.png"/>

CSS

.imageToRotate{
    transition: transform .5s;
}
.rotate180 {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}
.rotate90 {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
}

JavaScript

$(document).ready(function () {
    // Rotate on click
    $('.imageToRotate').click(function () {
        //$('.imageToRotate').toggleClass("rotate180");
    });
    
    // Rotate on mouse hover
    $('.imageToRotate').hover(function () {
        $('.imageToRotate').toggleClass("rotate180");
         $('.imageToRotate').toggleClass("rotate90");
        //$('.imageToRotate').addClass("rotate180");
    });
});