Rotating divs

by Sudipta Das

HTML

<div class="expand-btn" id="test1" data-degrees="0">
   <a href="javascript:void(0);" data-toggle="collapse">+</a>
</div>
<div class="expand-btn" id="test2" data-degrees="0">
   <a href="javascript:void(0);" data-toggle="collapse">+</a>
</div>
<div class="expand-btn" id="test3" data-degrees="0">
   <a href="javascript:void(0);" data-toggle="collapse">+</a>
</div>

CSS

div {
  width: 100px;
  height: 100px;
  border: solid 1px black;
  margin-right: 10px;
  float: left;
}

JavaScript

$(document).ready(function(){
  $('.expand-btn').click(function() {
  		var currentDegrees = $(this).data("degrees");
      currentDegrees += 15;
      $(this).css({'transform' : 'rotate(' + currentDegrees + 'deg)'});
      var currentDegrees = $(this).data("degrees", currentDegrees);
  });
});