DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>title>
<style>
#div1 {
width: 100px;
height: 100px;
background: red;
-webkit-transition: all 1s;
}
.div2 {
width: 100px;
height: 100px;
background: blue;
-webkit-transition: all 1s;
}
.animation{
width: 200px;
height: 200px;
}
style>
head>
<body>
<div id="div1">div>
<div class="div2">div>
<script>
var oDiv1=document.getElementById("div1");
var oDiv2=document.getElementsByClassName("div2")[0];
oDiv1.onclick=function(){
this.className="animation";
}
oDiv2.onclick=function(){
this.className="div2 animation";
}
script>
body>
html>