Audio loop onclick + Toggle button

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<style>
div{width:400px;height:600px;display:block;margin:auto;  }
img{width:400px;position:absolute;}
audio{width:0;}
button{ padding:20px;border-radius:50%;background-color:red;
position:absolute;outline:none;transform:translate(350px,10px);}
</style>
</head>
<body>

<div>
<img src='drake.jpg'/>
<audio id='audio' controls loop>
 <source src='Drake.mp3' type='audio/mp3'>
 </audio>
<button id='bt'></button>
</div>


<!--   YOUTUBE LINK ( https://youtu.be/007lWkD5NSE ) Drake - NonStop (Official Song)  -->


<script>

i=0;
bt.onclick=()=>{
if(i==0){
audio.play();
bt.style.backgroundColor='darkgreen';
i=1;
}else if(i==1){
audio.pause();
bt.style.backgroundColor='red';
i=0;
}
}

</script>
</body>
</html>