JSFiddle - React, Tailwind, and code Playground

by Roman Zhak

HTML

<div class="posts">
    <div class="post"></div>
    <div class="post"></div>
    <div class="post"></div>
    <div class="post"></div>
    <div class="post"></div>
    <div class="post"></div>
    <div class="post"></div>
    <div class="post"></div>
    <div class="post"></div>
    <div class="post"></div>
</div>  
    <button>Загрузить еще</button>

CSS

.post {
   display: none;
   width: 125px;
   height: 25px;
   border: 2px solid black;
   margin: 10px;
}

JavaScript

var news = $('.post'), shown = 0;

$('button').click(getMore);

function getMore(e) {
  news.slice(shown, (shown += 5)).show(500);
}

$('button').trigger('click');