Today I learned about jQuery’s greater than selector,
:gt() selector selects elements with an index number higher than a specified number. The index numbers start at 0.
I’m using this selector to hide more than 10 recent posts on my TIL page. Each of these posts is inside a list item (
li) and a child of the unordered list (
ul) with a class called “recent”. I then added a toggle function on a button to show them again by using the same selector.
There is also a less than selector in jQuery. It works similarly, except that it selects elements with an index number lower than the specified number. Syntax:
Note: Since I’m using a Jekyll site and generating that TIL list via Liquid, another solution is to set a counter after which it automatically adds a class directly to the HTML to hide those items that we can then toggle later. I think the jQuery solution is cleaner, though.