I'm trying to make the click only work 4 times and then not work afterwards although I am unsure what I am doing incorrectly?

Question

I'm trying to make the click only work 4 times and then o the opposite once that is finished although I am unsure what I am doing incorrectly?

 $(document).ready(function(){
   i=0;
   if(i<3){
     $('#nums').click(function(){
       $('#pic').stop().animate({top:'-=384px'},'300');
       i++;
     });        
   }else{
     $('#nums').click(function(){
       $('#pic').stop().animate({top:'+=384px'},'300'); 
     });
   }
});

Answer 1

You should wrap the .click around the "if else". Something like this:

$(document).ready(function(){
    var i=0;
    $('#nums').click(function(){
    if(i<3){
        $('#pic').stop().animate({top:'-=384px'},'300');
    i++;
        }else{
        $('#pic').stop().animate({top:'+=384px'},'300');    
        }
    });
});