how to use velocityjs to animate

Question

I can't make velocityjs to work, I also cannot use .animate() to work

can anyone tell me how to work with it? I always use javascript before.

I want to animate a div with class : .kotak-kecil, if the the div is hovered then it will add box-shadow and border into its css to make it looks like it is growing.

there was some errors in the console but now I already fixed all the errors about jquery but even after it fixed I still cannot make it to work at all

I'm including Jquery at the bottom of the page in order :

 jquery-214-min.js
 velocity.js
 AllJs.js // this is where I put the code to animate the div

HTML

 <div class='kotak-kecil'>
    Box 1
 </div>
 <div class='kotak-kecil'>
    Box 2
 </div>

CSS

 .kotak-kecil {
  float : left;
  width : 330px;
  height : 300px;
   padding: 20px;
   border: 10px solid transparent;
   box-shadow: none;

 }

AllJs.js

  $(document).ready(function(){
  $('.kotak-kecil').hover(function(){
    $('.kotak-kecil').velocity({
        boxShadow:'0px 4px 8px 1px #b9b4b4',
        borderBottom: '5px solid transparent',
         borderRight:'5px solid transparent'},350);
    });
  });