can't hide and show div with javascript after using condition

can't hide and show div with javascript after using condition

my javascript code should show 1 div and hide others according to where i click. it is working perfectly on desktop.

 
    
  
  1.  $(document).ready(function(){ 
    2. 
  
  2.       $("#canada-map").click(function(){
    3. 
  
  3.       $("#centrik").show(); 
    4. 
  
  4.       $("#axance").hide(); 
    5. 
  
  5. });
    6. 
  
  6. });
    7.

I am making my website responsive, so I added a condition that checks window width:

 
    
  
  1. $(document).ready(function(){ 
    2. 
  
  2. $("#canada-map").click(function(){ 
    3. 
  
  3. if($(window).width()>480) 
    4. 
  
  4. { 
    5. 
  
  5.       $("#centrik").show(); 
    6. 
  
  6.       $("#axance").hide(); 
    7. 
  
  7. } 
    8. 
  
  8. else 
    9. 
  
  9. { 
    10. 
  
  10.       $("#centrik").show();
    11. 
  
  11.       $("#axance").hide(); 
    12. 
  
  12.       $('#contact-mobile').stop().animate({ height: 610, opacity: 1 }, 'slow'); } 
    13. 
  
  13. }); 
    14. 
  
  14. });
    15.

When I added the condition, everything worked except the show and hide in the else. show and hide worked in the if, and the animation of #contact-mobileworked in else.

What can the problem be? thanks