Toggle CSS3 transition/animation by adding/removing a class

by lasha

HTML

<div class="toggleThis">Click to toggle animation</div>

CSS

.toggleThis {
    border: 1px solid #000;
    height: 20px;
    width: 200px;
    background-color: #ccc;
	-webkit-transition: all .2s linear;
}

/* .toggleThis.animated {
	-webkit-transform: scalex(1.5) scaley(1.5);
} */

.toggleThis.animated {
    height: 200px;
    -webkit-transform: rotate(30deg);
}

JavaScript

$(".toggleThis").on("click",function(e){
    $(this).toggleClass("animated");
});