Lista toggle

HTML

<ul class="product-categories">
<li class="cat-item cat-item-61 cat-parent">
   <a href="#">Cachorros</a>
   <ul class="children">
<li class="cat-item cat-item-48"><a href="">Ambiente</a></li>
<li class="cat-item cat-item-52 cat-parent">
   <a href="">Farmácia</a>
   <ul class="children">
      <li class="cat-item cat-item-54"><a href="">Antipulgas</a></li>
      <li class="cat-item cat-item-53"><a href="">Vermífugo</a></li>
      <li class="cat-item cat-item-55"><a href="">Vitaminas</a></li>
   </ul>
</li>
<li class="cat-item cat-item-35 cat-parent">
   <a href="">Higiene</a>
   <ul class="children">
      <li class="cat-item cat-item-38"><a href="">Tapete</a></li>
   </ul>
</li>
<li class="cat-item cat-item-33"><a href="">Petiscos</a></li>
<li class="cat-item cat-item-21 cat-parent">
   <a href="">Rações</a>
   <ul class="children">
<li class="cat-item cat-item-133"><a href="">Fórmula Natural</a></li>
<li class="cat-item cat-item-130"><a href="">Golden</a></li>
<li class="cat-item cat-item-145 cat-parent">
   <a href="">Gran Plus</a>
   <ul class="children">
      <li class="cat-item cat-item-156"><a href="">Adulto Mini</a></li>
      <li class="cat-item cat-item-157"><a href="">Adulto RM</a></li>
      <li class="cat-item cat-item-155"><a href="">Filhote Mini</a></li>
      <li class="cat-item cat-item-154"><a href="">Filhote RM</a>
   </ul>
</li>

JavaScript

jQuery('li.cat-parent > a:nth-child(1)').after('<i class="icon-toggle-cat">+</i>');

		jQuery('.icon-toggle-cat').on('click', function(){
			jQuery('li.cat-parent > ul.children').toggle();
		});