Return to Snippet

Revision: 24299
at March 10, 2011 07:21 by vagrantradio


Updated Code
<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);
      }
    });
  });
	 });

Revision: 24298
at February 25, 2010 11:39 by vagrantradio


Updated Code
<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");
	 jQuery(function($){

  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);
      }
    });
  });

});
	 });

Revision: 24297
at February 25, 2010 11:34 by vagrantradio


Initial Code
<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>
</ul>

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

  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);
      }
    });
  });

});
	 });

Initial URL


Initial Description
Quick and dirty but it does the job.

Initial Title
Group elements of ten lists items JQuery

Initial Tags
list

Initial Language
jQuery