How to do page search?

Question

JavaScript

jsfiddle.net - if we try to enter something in this example, the output will only match the page we are on. For example, if we are on the 1st page, and enter some data from the 2nd or 3rd page, then we will not see them, we will only see them by scrolling.
I can’t figure out how to make it so that if we enter into the search box on any page, then it is displayed on this page, and if there are more than 5 matches, then scrolling appears again (but by the elements that match the query).

Answer 1

Add class `page` to all pages. And then it is better to replace the `not-match` class with `match` and add to those elements that match the search. Then, after the search, all matching elements will have the class `match`. Then the algorithm for finding is as follows:
1. Take all pages (elements with class `page`). And we cycle through them.
2. If the current page has elements with the `match` class inside, remember its number and exit the loop.