Toggle the height of Unordered or Ordered Lists

list-height-toggle.js

(function($) {

    $( document ).ready(function() {

        var $sideNavs = $();

        $.fn.toggleHeight = function( options ){

            if( 'ontouchstart' in document ) return this;

            $sideNavs = $sideNavs.add(this);

            return this.each( function (){
                var $list = $( this ),
                    $lis = $list.find('li').length,
                    defaults = {
                        more: "More +",
                        less: "Less -",
                        length: 4,
                    },
                    settings = $.extend( true, {}, defaults, options );

                if( $lis > settings.length ){
                    $( 'li', $list ).eq( (settings.length - 1) ).nextAll().hide().addClass('toggleable');
                    $list.append('<li class="view-more"><a class="more" href="#">'+settings.more+'</a></li>');
                }

                $list.on( 'click', '.more', function( e ) {
                    var $link = $( e.currentTarget );

                    e.preventDefault();

                    if( $link.hasClass( 'less' ) ){
                        $link.html(settings.more).removeClass('less');
                    }else{
                        $link.html(settings.less).addClass('less');
                    }

                    $link.parent().siblings('li.toggleable').slideToggle('fast');

                });

            });
        }

        $('.link-list').toggleHeight( {length: 4} );

    });

}(jQuery));