+7 982 100 5 999

Кнопка «Показать еще» Jquery

HTML

<?php if( have_rows('цены', $queried_object) ): ?>
<div class="price-table">
    <div class="container">
        <div class="price_block">
            <div class="content-title">Цены</div>
            <table>
                <tr class="title-table">
                    <th>Наименование работы</th>
                    <th>Цена</th>
                </tr>
                <?php while( have_rows('цены', $queried_object) ): the_row(); ?>
                <tr>
                    <td><?php the_sub_field('наименование_работы'); ?></td>
                    <td><?php the_sub_field('цена'); ?></td>
                </tr>
                <?php endwhile; ?>
            </table>
            <a class="btn loadMorei" href="#">Показать еще</a>
            <div class="miniature">
                <img src="https://avatars.mds.yandex.net/get-pdb/1342781/29c47935-9a27-42d6-b2ab-80c201cd647c/s1200" alt="">
            </div>
        </div>
    </div>
</div>
<?php endif; ?>

LESS

table{
    tr{
        display: none;

        &:nth-child(-n+10){
            display: table-row;
        }
    }
}
.loadMorei{
    margin-top: 20px;
}

jQuery

//показать еще
(function(){
    $(function () {
        $(".price-table table tr").slice(0, 10).show();
        $(".loadMorei").on('click', function (e) {
            e.preventDefault();
            $(".price-table table tr:hidden").slice(0, 9999).slideDown(300);
            if ($(".price-table table tr:hidden").length == 0) {
                $("#load").fadeOut('slow');
            }
        });
    });
})();
//показать еще