title: Change :hover CSS properties with JavaScript
body: <p>How can JavaScript change CSS <code>:hover</code> properties?</p>
  <p>For example:</p>
  <p><strong>HTML</strong></p>
  <pre><code>&lt;table&gt;
    &lt;tr&gt;
      &lt;td&gt;Hover 1&lt;/td&gt;
      &lt;td&gt;Hover 2&lt;/td&gt;
    &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  <p><strong>CSS</strong></p>
  <pre><code>table td:hover {
  background:#ff0000;
  }
  </code></pre>
  <p>How can the <code>td :hover</code> properties be modified to, say, <code>background:#00ff00</code>, with JavaScript? I know I could access the style background property using JavaScript with:</p>
  <pre><code>document.getElementsByTagName(&quot;td&quot;).style.background=&quot;#00ff00&quot;;
  </code></pre>
  <p>But I don't know of a <code>.style</code> JavaScript equivalent for <code>:hover</code>.</p>