Issue on Having 3 Faces Flip Using jQuery

Issue on Having 3 Faces Flip Using jQuery

I am trying to create a Three Face Flip function in CSS3 and jQuery at this demo . Can you please take a look at the demo and let me know why the second face is missing?

Can you also please let me know how I can set up a Time out to flip all three faces every 10 seconds?

  2. <div class="flip"> 
  3.         <div class="card"> 
  4.             <div class="face one"> 
  5.                One
  6.             </div> 
  7.             <div class="face two"> 
  8.                 Two
  9.             </div> 
  10.               <div class="face three"> 
  11.                 Three
  12.             </div> 
  13.         </div> 
  14.     </div> 

  2.     $('.flip').click(function(){
  3.         $(this).find('.card').addClass('flipped').mouseleave(function(){
  4.             $(this).removeClass('flipped');
  5.         });
  6.         return false;
  7.     });