Вращение объекта при клике
 

Добрый день!
Есть вот такой код:

<img src="http://www.queness.com/resources/images/png/apple_ex.png" id="color">

<style>
  #color {
    transition-property: background-color;
    transition-duration: 3s;
  }
</style>

<script>
  color.onclick = function() {
    this.style.backgroundColor = 'red';
  }
</script>

При клике он меняет цвет фона. Нужно переделать этот код что бы при клика объект вращался на 360 градусов. Спасибо!

dany994,

<img src="http://www.queness.com/resources/images/png/apple_ex.png" id="color">

<style>
  .rotate {
    transform: rotate(360deg);
     transition: all 3s;
      background-color: #FF0000;
  }
</style>

<script>
  color.onclick = function() {
    this.classList.add("rotate")
  }
</script>