if else condition on hide and show in jquery

<script type="text/javascript">
  $(document).ready(function(){ 
    $(".fil-cat").click(function(){
      var val = $(this).attr('id');
      if(val == 'allCat'){
        $('.main-card').show();
      }else {
        $('.main-card').hide();
        $('.'+ val).show();
      }
      
    });
   });
</script><script type="text/javascript">
  $(document).ready(function(){ 
    $(".fil-cat").click(function(){
      var val = $(this).attr('id');
      if(val == 'allCat'){
        $('.main-card').show();
      }else {
        $('.main-card').hide();
        $('.'+ val).show();
      }
      
    });
   });
</script>