title: HTML and Javascript: how to set image as button?
body: <p>Hello I have the following button and JS code:</p>
  
  <pre><code>&lt;button type="button" id="play-pause" &gt;&lt;img id = "playbtn" src="img/icons/play.png"&gt;&lt;/button&gt;
   playButton.addEventListener("click", function() {
  
                if (video.paused == true) {
                  // Play the video
                  video.play();
  
                  // Update the button text to 'Pause'
                   document.getElementById("playbtn").src = "img/icons/pause.png";
                } else {
                  // Pause the video
                  video.pause();
  
                  // Update the button text to 'Play'
                  document.getElementById("playbtn").src = "img/icons/play.png";
                }
              });
  </code></pre>
  
  <p>When i click my button it changes the button to a play icon image and when i click it again it changes it to a pause icon button. This works fine but it still displays the default button background. I want it to be just an image. It currently gives my a button GUI with an image in it. Thats not what I want, how can I fix it?</p>