JSFiddle - React, Tailwind, and code Playground
HTML
<a href="#" id="myrotate">[ rotate ]</a>
<div style="border: 1px solid red;">
<img id="myimage" src="http://upload.wikimedia.org/wikipedia/mediawiki/a/a9/Example.jpg" style="border: 3px solid silver; " />
</div>
JavaScript
var step = 0;
$("#myrotate").click(
function (e) {
step += 1;
var img = $("#myimage");
img.css('transform', 'rotate('+ step*90 +'deg)');
var d = img.width() - img.height();
img.css('margin-left', -d/2*(step%2));
img.css('margin-top', d/2*(step%2));
}
);