如何用js动态改变圆的半径 _JavaScript

怎么用js动态改变圆的半径
<style type="text/css">
.circle {
background: #FF3300;
border-radius: 78.5px 78.5px 78.5px 78.5px;
padding:60px;
position: absolute;
margin-left:50px;
left: 242px;
top: 188px;
}
.circle1 {
background: #306;
border-radius: 78.5px 78.5px 78.5px 78.5px;
padding:45px;
position: absolute;
left: 135px;
top: 136px;
}
.circle2 {
background: #C33;
border-radius: 78.5px 78.5px 78.5px 78.5px;
padding:50px;
position: absolute;
left: 400px;
top: 135px;
}
.circle3 {
background: #0F0;
border-radius: 78.5px 78.5px 78.5px 78.5px;
padding:42px;
position: absolute;
left: 232px;
top: 75px;
}
.circle4 {
background: #36F;
border-radius: 78.5px 78.5px 78.5px 78.5px;
padding:63px;
position: absolute;
left: 201px;
top: 247px;
}
</style>
</head>

<body>
<div class="circle"></div>
<div class="circle3"></div>
<div class="circle1"></div>
<div class="circle4"></div>
<div class="circle2"></div>
</body>
</html>

圆已经生成了

------解决方案--------------------

HTML code


<style type="text/css">
.circle {
background: #FF3300;
border-radius: 78.5px 78.5px 78.5px 78.5px;
padding:60px;
position: absolute;
margin-left:50px;
left: 242px;
top: 188px;
}
.circle1 {
background: #306;
border-radius: 78.5px 78.5px 78.5px 78.5px;
padding:45px;
position: absolute;
left: 135px;
top: 136px;
}
.circle2 {
background: #C33;
border-radius: 78.5px 78.5px 78.5px 78.5px;
padding:50px;
position: absolute;
left: 400px;
top: 135px;
}
.circle3 {
background: #0F0;
padding:42px;
position: absolute;
left: 232px;
top: 75px;
}
.circle4 {
background: #36F;
border-radius: 78.5px 78.5px 78.5px 78.5px;
padding:63px;
position: absolute;
left: 201px;
top: 247px;
}
</style>
</head>

<body>
<div class="circle"></div>
<div class="circle3" id="test"></div>
<div class="circle1"></div>
<div class="circle4"></div>
<div class="circle2"></div>
<script type="text/javascript">
    var obj = document.getElementById('test');
    var t = 100;
    var i = 0;
    var timer = setInterval(function(){
        if( t ){
                obj.style.borderRadius = i+'px'; // w3c 
                obj.style.MozBorderRadius = i+'px'; // mozilla            
            t--;
            i++
            //console.log(i)
        }else{
            clearInterval(timer);
        }
    }, 30)
</script>
</body>
</html>