jeudi 24 janvier 2019

How to toggle all list items that are not equal to a specific text/category?

I have a HTML list and want to filter for a specific category. At example my list is:

<ul class="myList">
  <li class="list-choose">
      <input class="input-choose" type="checkbox" id="[ID]" name="ID[]"/>
      <label class="label-choose" for=[ID]></label>

      <div class="subtitle">
         <span class="category">[category]</span>
      </div>
  </li>
</ul>

(all in all there are about 40 list items, which should get filtered by category selection)

Now I want to create a category filter (in form of checkboxes/buttons/..) so that you can choose what category you want to display and hide all other elements that aren't in that selected category. My list items are created by an array ( a.e. [category]) so that the list item has its own category. But how can I filter only the selected category? I hope anyone can help me because my Javascript knowledges aren't the best.

Thank you!




Aucun commentaire:

Enregistrer un commentaire