title: Javascript/Jquery change class of Select after selecting option
body: <p>So I have a Select Box whose color is Grey but after selecting an option the color of the box should turn black. I am Using the following code to accomplish this event </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$('.change_color').on("change",function() {
    $(this).removeClass('grey_color');
    $(this).addClass('black_color');
  });</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.grey_color{
      color: #999;
  }
  .black_color{
      color: #000;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"&gt;&lt;/script&gt;
  &lt;div&gt;
    &lt;select class="change_color grey_color"&gt;
   &lt;option&gt;12th Standard&lt;/option&gt;
   &lt;option&gt;High School&lt;/option&gt;
   &lt;option&gt;First Year&lt;/option&gt;
    &lt;/select&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I Can't seem to figure out my error.</p>