Как объединить эти скрипты?

var dialog = document.querySelector('dialog'); 
document.querySelector('#show').onclick = function() { 
  dialog.show(); 
}; 
document.querySelector('#close').onclick = function() { 
  dialog.close(); 
}; 
 document.getElementById("show").onclick = function() 
    { 
      var myaudio = document.getElementById("myaudio"); 
      if(myaudio.paused == true) 
      { 
        document.getElementById("myaudio").play(); 
        this.style.backgroundColor = "Blue"; 
        this.style.color = "White"; 
      } 
      else if (myaudio.paused == false) 
      { 
        document.getElementById("myaudio").pause(); 
        this.style.backgroundColor = "White"; 
        this.style.color = "Black"; 
      } 
    } 
   

<dialog> 
  <p>Это всплывающее окно, которое сделано на html5 и javascript</p> 
  <button id="close">Закрыть</button> 
</dialog> 
<button id="show" type="button">Открыть всплывающее окно!</button> 
<audio id="myaudio" src="мелодия.mp3"> 
</audio>