Looking for a substring in an attribute

Question

I've put the id's from all checked checkboxes into an array and converted it to a string. Now I want to loop over all the labels in my HTML and see if value of the for attribute matches with something in the string of all ids, and if this matches change the css of the label. Thank you in advance.

var $all_labels = $('.filter-choices label')

$all_labels.each(function(){
      var self_item = $(this)
      if( self_item.attr('for').is(checked_items_ids_string) === true){
      self_item.css('color','white')
   }
});

Answer 1

First I've put the id's from all checked checkboxes into an array and converted it so a string

Now I want to loop over all the labels in my HTML and see if value of the for attribute matches with something in the string of all ids.

Try with

var checkedItems = []; //assuming this is already populated
$( "label[for]" ).each( function(){
   var idVal = $(this).attr( "for" );
   if ( $("#" + idVal).length > 0 && checkedItems.indexOf( idVal ) != -1 )
   {
      //element with id exists
      $(this).css('color','white')
   }
})

Answer 2

Maybe this approach will be helpful also:

 $('button').click(function () { $('input').each(function () { if ($(this).is(':checked')) $(this).prev('label').css("color", "red") else $(this).prev('label').css("color", "black") }) }) 

 <label for="i1">Input 1: </label> <input type="checkbox" id="i1"> <br> <label for="i1">Input 1: </label> <input type="checkbox" id="i1"> <br> <label for="i1">Input 1: </label> <input type="checkbox" id="i1"> <br> <label for="i1">Input 1: </label> <input type="checkbox" id="i1"> <br> <label for="i1">Input 1: </label> <input type="checkbox" id="i1"> <br> <button>Change labels</button> <script src="https://unpkg.com/jquery"></script>