Using jQuery for Spliting li list to three ul list and speparating them with hr

In short :

foo = [1,2,3,4,5,6,7,8];
alert(foo);
bar = foo.slice(3);
alert(bar);

and more complex example:

<ul class="products">
<li>object1</li>
<li>object2</li>
<li>object3</li>
<li>object4</li>
<li>object5</li>
<li>object6</li>
<li>object7</li>
<li>object8</li>
<li>object9</li>
<li>object10</li>
</ul>
//split ul into three parts with hr between
//add 2 uls after first one
//move lis into 2 uls
jQuery("li.product-cat-an-mala-mor").parent("ul").addClass("splitme");
	if(jQuery(".splitme").length > 0) {
		jQuery(".splitme").after('<hr class="product-separator"><ul class="products splitme2"></ul><hr class="product-separator"><ul class="products"></ul>');
		jQuery("ul.products").eq(1).append(jQuery(".splitme li").slice(3).detach());
		jQuery("ul.products").eq(2).append(jQuery(".splitme2 li").slice(2).detach());
		}

Because I using this on woocomerce shop, I was added extra class splittime with the if statement to make sure is all changes will work only in one category .

 

Leave a Reply

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