Как в табе показать только первые два элемента?

Question

[Сергей Бурдужа]

Есть табы.
На экране меньше 1200 нужно показать только 2 элемента и кнопку "показать далее".

<div id="js-tabs_content" class="tabs-content-wrap">
	<div class="tabs__item">
		<div class="tabs-content">Lorem ipsum dolor sit amet, consectetur.</div>
		<div class="tabs-content">Excepturi pariatur perspiciatis praesentium ratione vel.</div>
		<div class="tabs-content">Fugit maxime obcaecati quibusdam repellat unde!</div>
		<div class="tabs-content">Blanditiis natus nihil officiis. Incidunt, omnis.</div>
	</div>
	<div class="tabs__item">
		<div class="tabs-content">Lorem ipsum dolor sit amet, consectetur.</div>
		<div class="tabs-content">Enim, quia, sequi! Minus, rerum velit?</div>
		<div class="tabs-content">Consequatur eum odit quas tempore voluptas.</div>
		<div class="tabs-content">Dicta eaque enim optio veritatis voluptas?</div>
	</div>
	<div class="tabs__item">
		<div class="tabs-content">Lorem ipsum dolor sit amet, consectetur.</div>
		<div class="tabs-content">Aliquam aspernatur dolore ipsum iusto quo.</div>
		<div class="tabs-content">Animi dicta eius ex ipsum ullam!</div>
		<div class="tabs-content">Alias aperiam magnam molestias officiis repellendus.</div>
	</div>
</div>

В javascript получаю эти элементы

let tabsItems = $('#js-tabs_content .tabs__item');

    for(let i = 0; i < tabsItems.length; i++){
        tabsItems.children().slice(2).css('background', 'red');
    }

В результате я получаю массив из трех дом элементов div.tabs__item



Подскажите, куда двигаться?

Answer 1

[Сергей Бурдужа]

Решил таким образом

/* show tabs subitems min 1200
    ====================================================*/
    function showTabs(){
        let tabsContentItems = $('#js-tabs-content .tabs-content__item .row');
        let jsTabsBtn = tabsContentItems.find('.btn-tabs');


        jsTabsBtn.nextAll().hide();

        $('#js-tabs-content .btn-tabs').on('click', function(){
            let $this = $(this);
            $this.hide();
            $this.nextAll().fadeIn();
        });
    }

    if($(window).width() < 1200){
        showTabs();
    }

    $(window).resize(function(){
        if($(window).width() < 1200){
            showTabs();
        }else{
            $('#js-tabs-content .btn-tabs').nextAll().show();
        }
    });