Posted By

vagrantradio on 02/25/10

Tagged

list

Versions (?)

Last Edited at 02/25/10 11:34am

Statistics

Viewed 665 times

Favorited by 0 user(s)

Related snippets

Group elements of ten lists items JQuery

/ Published in: jQuery

Quick and dirty but it does the job.

Highlighted TextExpand

<ul>
<li class="child">one</li>
<li class="child">two</li>
<li class="child">three</li>
<li class="child">four</li>
<li class="child">five</li>
<li class="child">six</li>
<li class="child">seven</li>
<li class="child">eight</li>
<li class="child">nine</li>
<li class="child">ten</li>
<li class="child">eleven</li>
<li class="child">twelve</li>
<li class="child">thirteen</li>
<li class="child">fourteen</li>
<li class="child">fifteen</li>
<li class="child">sixteen</li>
<li class="child">seventeen</li>
<li class="child">eightteen</li>
<li class="child">nineteen</li>
<li class="child">twenty</li>
</ul>

$(document).ready(function() {
   $("#announcements ul").find("li:nth-child(10n+3)").removeClass("child").addClass("parent");

var $everything = $('.parent,.child');
  var splitAtHeaders = [];

$everything.each(function(index){
    var $item = $(this);
    if ('parent'===$item.attr('className') || !splitAtHeaders.length) {
      splitAtHeaders[splitAtHeaders.length] = [];
    }
    splitAtHeaders[splitAtHeaders.length-1].push($item);
  });

$.each(splitAtHeaders, function(){
    var currentWrapper = null;
    $.each(this, function(index){
      if (0===index || !currentWrapper) {
        currentWrapper = this.wrap('<ul class="ul_wrap"></ul>');
				$(this).before("10");
      }
      else {
        currentWrapper.append(this);
      }
    });
  });
	 });

Report this snippet Tweet

Comments

Subscribe to comments

Comment:

You need to login to post a comment.