5th tab slick slider not working. How to fix?

Question

JavaScript

It’s the 5th that doesn’t work, if I swap it, the fifth one won’t work anyway

$(function() {
  $('#price .price-slider').slick({
     slidesToShow: 1,
     slidesToScroll: 1,
     infinite: false,
     arrows: false,
     centerMode: true,
     variableWidth: true,
     arrows: true,
     prevArrow: '.price-prev-arrow',
     nextArrow: '.price-next-arrow',
      responsive: [
         {
           breakpoint: 601,
           settings: {
            centerMode: false,
            arrows: false,
            variableWidth: false
           }
         }
       ]
    });
  $("#price .price-nav__item").on('click', function(){
      var filter = $(this).data('filter');
       $("#price .price-slider").slick('slickUnfilter');
      
      if(filter == 'one'){
        $("#price .price-slider").slick('slickFilter','.one');
      }
      else if(filter == 'two'){
        $("#price .price-slider").slick('slickFilter','.two');
      }
      else if(filter == 'three'){
        $("#price .price-slider").slick('slickFilter','.three');
      }
      else if(filter == 'four'){
        $("#price .price-slider").slick('slickFilter','.four');
      }
      if(filter == 'penthouse'){
        $("#price .price-slider").slick('slickfilter','.penthouse');
      }   
  })
});