simple-view-more

index.html

<ul class="gallery">
  <li>one</li>
  <li>two</li>
 </ul>

<ul class="gallery">
  <li>three</li>
  <li>four</li>
 </ul>

<ul class="gallery">
  <li>five</li>
  <li>six</li>
 </ul>

<button>View More</button>

script.js

$(document).ready(function() {
  var gallery= $('.gallery');
  gallery.addClass('hidden');
  gallery.first().removeClass('hidden');
  
  //look for all the hidden items, and show the first one
  $(document).on('click', 'button', function(){
    $('.gallery.hidden').first().slideDown().removeClass('hidden');
  });
});

simple-view-more.markdown

Simple "View More" feature

A Pen by charlyn on CodePen.

License.

style.css

.hidden {
  display: none;
}