javascript - Add class to link slug based off array of slugs -

i creating recipe tool takes user's input via selected checkboxes. see here: zelda.wptoolkit.us

part one: have script create array of slugs based off of selected input values. when user clicks checkbox, associated slug added array called checkedattr.

<script> var checkedattr = [];  $('#wp-advanced-search :checkbox').change(function()  { checkedattr = []; $('#wp-advanced-search :checkbox').each(function(i, item){     if($(item).is(':checked'))     {         checkedattr.push($(item).val());      } }); console.log("checkedattr:", checkedattr); }); </script> 

part two: trying use code below .addclass links contain slug found in array part one.

the link structure: http://zelda.wptoolkit.us/tag/any-crab/

the code:

<script type="text/javascript"> jquery(function() { jquery('#wpas-results-inner > div > div > p > a[href^="/tag/' +  location.pathname.split("/") this.checkedattr[0] + '"]').addclass('active'); }); </script>  

what aiming target links in each card, add class links slug found in array. end goal highlight checked 'ingredients' , fade out ingredients haven't been checked.

i not sure how make function check array each slug, love learn steps needed accomplish this!

i not if jquery css path correctly targeting links

thanks insights!

if looking when select particular checkbox, card related checkbox should enabled(lets apply class active) , once dis-select checkbox, need remove particular class related checkbox??

you can check given fiddle. https://jsfiddle.net/stdeepak22/x1l95dw3/1/

var checkedattr = [];  $('#checkboxforcategory :checkbox').change(function()  {         var cardcategory = $(this).val();         var allcards = $('.mycard[card-category=' + cardcategory + ']');      if($(this).is(':checked'))     {             //add selected category array         checkedattr.push(cardcategory);           //add `active` class card belongs selected category         $(allcards).each(function()         {           $(this).addclass('active');         });     }     else     {         //remove array       var index = checkedattr.indexof(cardcategory);       checkedattr.splice(index, 1);        //remove class card belongs selected category         $(allcards).each(function()       {         $(this).removeclass('active');       });     }          console.log("checkedattr:", checkedattr); });