If you keep up with my posts, you'll know I'm a big fan of graceful degradation when it comes to JavaScript. For me, graceful degradation means two things:

  1. Happier non-javascript users
  2. Happier search engines

A search engine is like a non-javascript user in many ways, as it crawls content without applying any javascript (or css) to it.

With that aside, I thought I'd toss out another method of collapsing content while adhering to rules of graceful degradation. Sometimes we find our unordered or ordered lists get a little lengthy. Instead of paginating or truncating them, you can "collapse" them with just a few lines of jQuery:

$('ul').each(function() {
    if($(this).find('li').length > 1)

$('li span').click(function() {


Leave a Reply

Your email address will not be published. Required fields are marked *