I am using mixitup for a restaurant menu, but I want that when the page is loaded it is filtered only in one of the menu categories instead of showing all the dishes, that is, I do not want the "all" The first thing that is shown is "areperia".
<ul id="filter-list" class="clearfix">
<li class="filter active" data-filter="areperia">Areperia/Starters</li>
<li class="filter" data-filter="parrilla" >La parrilla - BBQ</li>
<li class="filter" data-filter="desayunos" >All day brekkie specials</li>
<li class="filter" data-filter="limitados" >Limited editions</li>
<li class="filter" data-filter="pizzeria" >La pizzeria - Pizzas</li>
<li class="filter" data-filter="ensaladas" >Ensaladas - Salads</li>
<li class="filter" data-filter="limon" >Ensaladas de limon - Lime salads</li>
<li class="filter" data-filter="taqueria" >La taqueria</li>
<li class="filter" data-filter="dulces"> La reposteria - Sweets </li>
<li class="filter" data-filter="bebidas">La cafeteria - Coffees,teas,driks</li>
</ul><!-- @end #filter-list -->
<ul id="portfolio">
<li class="item areperia">
<h3><B>Arepas</B><br> BBQ roasted corn breads (butter optional)</h3>
<h2 class="precio">2 for $5</h2>
</li>
<li class="item areperia">
<h3>Arepa rainbow<br> 3 corn breads of spinach,sweet popato & beetroot</h3>
<h2 class="precio centro">$10</h2>
</li>
<li class="item areperia">
<h3>Yuca frita<br> Deep fried cassava root</h3>
<h2 class="precio">3 for $5</h2>
</li>
<li class="item parrilla">
<h3>Pinchos Vegetarianos<br>BBQ begie + haloumi sticks</h3>
<h2 class="precio">2 for $10</h2>
</li>
<li class="item parrilla">
<h3>Mazorca<br>BBQ roasted corn</h3>
<h2 class="precio">$5</h2>
</li>
</ul>
and my js is, here I am not making any strange modifications but I already try several things and nothing
$(function(){
$('#portfolio').mixitup({
targetSelector: '.item',
transitionSpeed: 350,
});
});