title: Set button state to active with jQuery
body: <p>I need to get my buttons to become <code>:active</code> state when some keyboard button is pressed and not just when clicked.</p>
  <p>here is my code... thanks in advance.</p>
  <p>Script :</p>
  <pre><code>$(document).on('keypress', function (e) {
      var tag = e.target.tagName.toLowerCase();
      if (e.which === 119 &amp;&amp; tag != 'input' &amp;&amp; tag != 'textarea')
          $('#forward').click();
      if (e.which === 115 &amp;&amp; tag != 'input' &amp;&amp; tag != 'textarea')
          $('#back').click();
      if (e.which === 97 &amp;&amp; tag != 'input' &amp;&amp; tag != 'textarea')
          $('#left').click();
      if (e.which === 100 &amp;&amp; tag != 'input' &amp;&amp; tag != 'textarea')
          $('#right').click();
  });
  
  $(function () {
      $(&quot;#forward&quot;).click(function () {
          $.ajax('/forward');
      });
      $(&quot;#back&quot;).click(function () {
          $.ajax('/back');
      });
      $(&quot;#left&quot;).click(function () {
          $.ajax('/left');
      });
      $(&quot;#right&quot;).click(function () {
          $.ajax('/right');
      });
  });
  </code></pre>
  <p>HTML :</p>
  <pre><code>&lt;ul class=&quot;button-list&quot;&gt;
   &lt;li&gt;
      &lt;button id=&quot;forward&quot;&gt;W&lt;/button&gt;
   &lt;/li&gt;
   &lt;li&gt;
      &lt;button id=&quot;back&quot;&gt;S&lt;/button&gt;
   &lt;/li&gt;
   &lt;li&gt;
      &lt;button id=&quot;left&quot;&gt;A&lt;/button&gt;
   &lt;/li&gt;
   &lt;li&gt;
      &lt;button id=&quot;right&quot;&gt;D&lt;/button&gt;
   &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  <p>...................................................................................</p>