title: How to change an HTML class with JavaScript using getElementsByClassName
body: <p>How to change a class with Javascript using getElementsByClassName. I got it to work a little but it won't change the class one at the time bet only do it one time to.</p>
  
  <p>I click the button to change css class it do it on all the div and I can do it more in one time.</p>
  
  <p>Here is my Code</p>
  
  <pre><code>function Button_Color(Show_This) {
      var x = document.getElementById("Color_box");
      var i;
      var Show_This;
  
      if (Show_This == 1)
      {
          var d = document.getElementsByClassName("id_blue");
          d[0].className = "hid";
  
          var o = document.getElementsByClassName("id_red");
          o[0].className = " uhid";
      }
      if (Show_This == 2) {
  
              var d = document.getElementsByClassName("id_blue");
          d[0].className = "hid";
  
          var o = document.getElementsByClassName("id_red");
          o[0].className = " uhid";
      }
  
  
  }
  </code></pre>
  
  <p>Here is a like to show you how it looks now with html css js
  <a href="https://jsfiddle.net/ee51o5h5/1/" rel="nofollow noreferrer">https://jsfiddle.net/ee51o5h5/1/</a></p>
  
  <p>I want it to show red only when you click the little red one and blue only when you click the little blue one.</p>
  
  <p>i am dyslexic and from a non-english speaking country so sorry for any miss up.</p>