Как скрыть часть полей в таблицах?

Есть 3 таблицы, нужно скрывать в каждой часть информации, по нажатию показывать скрытую часть.
Пример одной из таблиц:

<div class="building-specifications">
  <table class="building-specifications__table">
      <tbody>
        <tr class="building-specifications-itm">
          <td class="building-specifications-itm__caption">Адрес</td>
          <td class="building-specifications-itm__value">Ул. Пушкина</td>
        </tr>
        <tr class="building-specifications-itm">
          <td class="building-specifications-itm__caption">Дом</td>
          <td class="building-specifications-itm__caption">Колотушкина</td>
        </tr>
        <tr class="building-specifications-itm">
          <td class="building-specifications-itm__caption">Подъезд</td>
          <td class="building-specifications-itm__value">1</td>
        </tr>
        <tr class="building-specifications-itm">
          <td class="building-specifications-itm__caption">Квартира</td>
          <td class="building-specifications-itm__value">1</td>
        </tr>
      </tbody>
    </table>
  <button type="button" class="btn building-specifications__btn-show">Показать все характеристики</button>
</div>

(в ссылке на codepen полный вариант)
В примере показана проблема - вместо того чтобы в каждой таблице показывать по 2 поля, показывает 2 поля только в первой таблице, в остальных скрывает.

ссылка на пример:
https://codepen.io/maksimlavrenyuk/pen/vvLvRg

Я понимаю, что т.к. я использую такую конструкцию:

$('.building-specifications-itm:gt('+SpecificationsItmShow +')').hide();

скрываются все элементы с .building-specifications-itm, кроме тех, которые обозначены в gt().

Не понимаю как производить проверку количества позиций отдельно для каждой таблицы