JSFiddle - React, Tailwind, and code Playground
HTML
<ul>
<li>List Item #1</li>
<li>List Item #2</li>
<li>List Item #3</li>
<li>List Item #4</li>
<li>List Item #5</li>
<li>List Item #6</li>
<li>List Item #7</li>
<li>List Item #8</li>
<li>List Item #9</li>
</ul>
JavaScript
$('ul')
.find('li:gt(2)')
.hide()
.end()
.append(
$('<li>Show More!</li>').click( function(){
var txt = $(this).text() == "Show More!" ? "Show Less!" : "Show More!";
$(this).text(txt).siblings(':gt(2)').toggle(500);
})
);