Скрыть Дополнительные элементов списка

by Max Belov

HTML

<ul class="collapse">
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
  <li>Four</li>
  <li>Five</li>
  <li>Six</li>
  <li>Seven</li>
  <li>Eight</li>
</ul>

JavaScript

$(document).ready(function(){
  $("ul.collapse").find("li:gt(4)").hide();
  $("ul.collapse").has("li:nth-child(5)").after("<p class=\"showhide\">Show/Hide</p>");
  $("p.showhide").click(function() {
    $("ul.collapse").find("li:gt(4)").toggle("slow");
  });
});