title: HTML audio element not playing on first time?
body: <p>I'm using the html <strong>audio</strong> element in one of my projects where I load the src of the element dynamically using VueJS once the play button is pressed.</p>
  
  <p>Everything seems to work fine, but when I press the button on the first time the audio doesn't play. I have to click the play button a second time to make it start playing. How can I fix this? </p>
  
  <p>I even checked whether the src is there before playing by using console.log(element) which shows the audio with the SRC. </p>
  
  <p>But it is not playing in the first attempt.</p>
  
  <p>My code looks like this.</p>
  
  <pre><code>var player = document.getElementById('player');
  console.log(player)
  if(player.src != ""){
      player.play();
  };
  </code></pre>
  
  <p>How can I fix this? Thanks. It's very annoying.</p>