title: Comparing difference between 2 node lists and 1 array
body: <p>I have a 2 variables that fetch the values of two different checkbox input series into Nodelists (these are user selected colors) and one array containing the master list of all available colors:</p>
  
  <pre><code>Color1elementsList = document.querySelectorAll("#question5 input:checked");
  Color2elementsList = document.querySelectorAll("#question10 input:checked");    
  var elements = ["red", "blue", "green", "yellow", "black"];
  </code></pre>
  
  <p>The idea is to figure out what colors from the master list have not been selected between Color1elementsList and Color2elementsList and store those into another array: ColorelementsLeft.</p>
  
  <p>My efforts:</p>
  
  <pre><code>function checkColors(){
      var Color1ArrayElements = []; // empty Array
      var Color2ArrayElements = []; // empty Array
      var ColorelementsLeft = []; // empty Array
  
  //convert nodelist to array
      for (var i = 0; i &lt; Color1elementsList.length; i++) {
          var self = Color1elementsList[i].value;
          Color1ArrayElements.push(self);
      }
  
  //convert nodelist to array
      for (var i = 0; i &lt; Color2elementsList.length; i++) {
          var self = Color2elementsList[i].value;
          Color2ArrayElements.push(self);
      }
  
      ColorelementsLeft = elements - Color1ArrayElements - Color2ArrayElements;   
      console.log(ColorelementsLeft);
  }
  </code></pre>
  
  <p>Obviously the formula for ColorelementsLeft is incorrect but I'm not sure where to start.</p>
  
  <p>Assuming the user selects red and blue in the first input list and then red and yellow on the second, ColorelementsLeft should contain green and black.</p>