Untitled

<!DOCTYPE html>
<html>
<head>
    <title></title>

    <style type="text/css">
        #cir{
                width: 150px;
                height: 150px;
                border-radius: 50%;
                background-color: green;
            }
    </style>
</head>
    <body>
        <div id="cir"></div>
        <script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js"> </script>
        <script>
            $("#cir").click(function() {
                $("#cir").animate({width:"400px", height:"400px", marginLeft:"100px", marginTop:"100px"},2000, function(){
                    $(this).css("background-color","blue");
                });
            });
        </script>
    </body>
</html>