jquery rotate image onclick

Depending on which browser versions you need to support, you could try CSS tranforms.

First, define a CSS class like this:

.rotated {
  transform: rotate(90deg);
  -ms-transform: rotate(90deg); /* IE 9 */
  -moz-transform: rotate(90deg); /* Firefox */
  -webkit-transform: rotate(90deg); /* Safari and Chrome */
  -o-transform: rotate(90deg); /* Opera */
}

And then you can use jQuery to add the class when clicking the link:

<img src="down_arrow.png" onclick="$(this).addClass('rotated');" />

Use a combination of css rules -webkit-transform and -moz-transform on image click.For example to rotate image by 90 degree apply following css rules on click

$('img').click(function(){
    $(this).css({
        "-webkit-transform": "rotate(90deg)",
        "-moz-transform": "rotate(90deg)",
        "transform": "rotate(90deg)" /* For modern browsers(CSS3)  */
    });
});

Consider a jQuery extension such as: jQueryRotate

It'll make the rotating inside the onclick much easier and more readable.