JavaScript/Pagination (simple)

There are a variety of ways to implement pagination on a website. This is a generic example with the goal of being easy to understand. For a more sophisticated lesson, see JavaScript/Pagination.

The JavaScript code works by counting the pages inside a container element and showing the selected page while hiding the others. It is scaleable, meaning new pages can be added without needing to change the script.

All pages are shown by default so users without JavaScript can still read the content. When the script is initiated, the first page is selected.

Pages
  Page 1 | Page 2 | Page 3 | Page 4 | Page 5 

 Text of page 1 Text of page 2 Text of page 3 Text of page 4 Text of page 5