Filtering content with buttons, but when all are active and one is clicked again, it only shows that result

Question

everyone. As the title suggests, I'm trying to use buttons to filter my pricing tables, which is working, but when all buttons are clicked/active (minus the clear button, which shows all the content again) and you click another one, it will only show the filter result of the last button clicked. What should happen is that when all buttons are active (minus the clear button) and another is clicked, the result will stay the same

<script>

$(document).ready(function() {
  $('.btn').click(function() {
    var pars = $('#contents div');
    

    if ($(this).data('target') == 'all') {          
      pars.show(); 
      $('.btn').removeClass('active');
      
      
    } else {
      if ($('#contents div:visible').length == pars.length) {                
        pars.hide();
        
      }

      $('#contents div.' + $(this).data('target')).show();
      $(this).addClass('active');
      
    }
  })
})

</script>


<button id="B1" class="btn" data-target="columns-one">B1</button>
<button id="B2" class="btn" data-target="columns-two">B2</button>
<button id="B3" class="btn" data-target="columns-three">B3</button>
<button id="clear" class="btn" data-target="all">Clear</button>

What I've gathered is that its a logical error in the else statement, that will hide the results because all the content is showing. I've tried disabling the buttons to prevent users from being able to the click active buttons again, button it doesn't work as intended.

<script>

$(document).ready(function() {
  $('.btn').click(function() {
    var pars = $('#contents div');
    var buttonId = $(this).attr('id');

    if ($(this).data('target') == 'all') {          
      pars.show(); 
      $('.btn').removeClass('active');
      $('.btn').prop('disabled', false);
      
    } else {
      if ($('#contents div:visible').length == pars.length) {                
        pars.hide();
        buttonId.prop('disabled', true);
      }

      $('#contents div.' + $(this).data('target')).show();
      $(this).addClass('active');
      
    }
  })
})

</script>

I'd appreciate any advice/help given. Thanks