A little problem with toggleClass

A little problem with toggleClass

I'm having a little problem with toggle class here:  https://jsfiddle.net/sxnk6jwr/13/
if you click 1 and 3, the first td cell's highlight will switch from orange to gray. 

I'd appreciate a little help to solve this issue, please. thanks.

here is jquery:
  1.  $(function(){
  2.   $('#btn1').on('click', function() {
  3.     $('#tb1 td').slice(0, 3)
  4.                       .toggleClass('orange');
  5.   });
  6.   $('#btn2').on('click', function() {
  7.     $('#tb1 td').slice(3, 6)
  8.                       .toggleClass('orange');
  9.   });
  10.   
  11.    $('#btn3').on('click', function() { 
  12. $("#tb1 tr:gt(-7):lt(3) td:nth-child(1)").toggleClass('orange');
  13.   });
  14.   
  15.  $('#btn4').on('click', function() { 
  16. $("#tb1 tr:gt(2):lt(6) td:nth-child(1)").toggleClass('orange');
  17.   });
  18.   
  19. });


  20.    $(".button").click(function(){
  21.   $(this).toggleClass("active");
  22. });