title: How to change a Pseudo-class style through JavaScript?
body: <p>This example is, for a matter of simplicity, just an illustration of what I need to do.
  Say, I have an element, which style is set in a CSS. The style is set for the element as well as for a Pseudo-class, say element:hover. I can override the style for the element with the following JavaScript:
  element.style.setProperty('property-name', 'new value', '').
  How can I change the Pseudo-class's style through JavaScript?</p>
  
  <p>Thank you.</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
        &lt;style type='text/css'&gt;
               #myBtn {
                  background-color: red;
               }
               #myBtn:hover {
                  background-color: blue;
               }
        &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
        &lt;button id='myBtn'&gt;Colored button&lt;/button&gt;
  
        &lt;button onclick="ChangeColor();"&gt;Script button&lt;/button&gt;
  
        &lt;script type="application/x-javascript"&gt;
                function ChangeColor() {
                   var Btn = document.getElementById('myBtn');
                   Btn.style.setProperty('background-color', 'green', '');
                };
        &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>