title: Get all css root variables in array using javascript and change the values
body: <p>I am using css root variables in my project for dynamically changing the colors of all elements anytime.</p>
  
  <p>My css looks like</p>
  
  <pre><code>:root{
    --primaryColor:aliceblue;
    --secondaryColor:blue;
    --errorColor:#cc2511;
  }
  </code></pre>
  
  <p>used in css</p>
  
  <pre><code>.contentCss {
    background-color: var(--primaryColor);
  } 
  </code></pre>
  
  <p>I can access variable in javascript as follows to change value dynamically</p>
  
  <pre><code>document.documentElement.style.setProperty('--primaryColor', 'green');
  </code></pre>
  
  <p>It works fine. I want to get all variables inside an array and according to that change the values of each variable dynamically.   </p>