title: moving button in javascript
body: <p>There are <code>next</code> and <code>prev</code> buttons in the slideshow, that I want they move a few pixels and change their colors after clicking on these buttons. The button returns to the normal position by removing the mouse. Although I know I can coding with CSS, but it is part of my homework and I have to do that with javascript. This is my code but it doesn't work and I don't know why ...</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>function press() {
      document.getElementById(this).style.right = "-10px";
      document.getElementById(this).style.backgroundColor = "red";
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;a class="prev" onclick="plusSlides(1)" onmousedown="press()"&gt;&amp;#10094;&lt;/a&gt;
  &lt;a class="next" onclick="plusSlides(-1)" onmousedown="press()"&gt;&amp;#10095;&lt;/a&gt;</code></pre>
  </div>
  </div>
  </p>