Posted By

smashu on 04/22/10

Tagged

list
jquery

Versions (?)

Last Edited at 04/22/10 08:58am

Statistics

Viewed 891 times

Favorited by 0 user(s)

Related snippets

jquery split list in 2 columns

/ Published in: JavaScript

Expand | Embed | Plain Text

Copy this code and paste it in your HTML

var splitList = function(listClass) {
    var originalList = $(listClass);
    var originalItems = originalList.children();
    var splitAt =  Math.round(originalItems.length/2);
 
    //clone it but hide it
    var cloneList = originalList.clone().insertAfter(originalList).css('display','none');
    var clonedItems = cloneList.children();
 
    //remove first half of LIs from clone list
    for (var i=0; i<clonedItems.length; i++) {
        if(i < splitAt) {
            $(clonedItems[i]).remove();
        }
    }
    //remove last half of LIs from original list
    for (var i=0; i<originalItems.length; i++) {
        if(i >= splitAt) {
            $(originalItems[i]).remove();
        }
    }
    //show it
    cloneList.css('display','block');
}