title: Add class to multiple elements with multiple data attributes
body: <p><strong>What I need:</strong>
  I have a large data set that have multiple attributes on them. I need to search through the data set and apply a css class if they contain a certain attribute -- such as country. In the example below, I want to be able to click a button and change every element that has the data attribute 'usa' to a new class, blue. </p>
  
  <p><strong>What I have:</strong>
  I have applied multiple data attributes to each element. While I know this isn't directly supported, I am using javascript to split them into an array. Then, I'm trying to target all arrays on the page and add a class to them if they contain a value (such as country name). What I can't figure out is how to target ALL arrays on the page and then if I do, how to apply classes directly to the ones that contain the particular attribute. </p>
  
  <p>Here is a simplified mockup: </p>
  
  <pre><code>&lt;div id="collection"&gt;
  &lt;div class="countries" data-place="usa;canada;mexico"&gt;&lt;/div&gt;
  &lt;div class="countries" data-place="usa;ireland;france"&gt;&lt;/div&gt;
  &lt;div class="countries" data-place="spain;canada;mexico"&gt;&lt;/div&gt;
  &lt;div class="countries" data-place="usa;spain;france"&gt;&lt;/div&gt;
  &lt;div class="countries" data-place="portugal;canada;ireland"&gt;&lt;/div&gt;
  &lt;/div&gt;
  
  &lt;button class="unitedstates"&gt;Change USA to Blue&lt;/button&gt;
  
  &lt;script&gt;
  
  var data = document.getElementById('collection').getAttribute('data-country');
  var arr = data.split(';');
  
  $(".unitestates").click(function () {
  console.log(arr);
      if (jQuery.inArray('usa', arr) &gt; -1) {
          $("#countries").addClass('blue')
      }
  });
  </code></pre>
  
  <p></p>