在屏幕底部播放歌曲并更改图像的onclicks

Question

我创建了一个显示三首歌曲的简单音乐播放器。单击单个歌曲后，我希望更改屏幕底部的图像。这是我的html和js。任何帮助，将不胜感激。我对此很新。是否最好做两个函数，如onclick changeSong（）; changePic（）？

<div id="container">
    <audio id="player">
        <source src="assets/Beethoven-Symphony5-1.mp3">
    </audio>
    <button id = "btnPlay">Play</button>
    <button id = "btnPause">Pause</button>
    <button id = "btnStop">Stop</button>
    <label for="rngVolume">Volume</label>
    <input type="range" id="rngVolume" min="0" max="1" step=".01" value=".5" data-highlight="true" onchange="changeVolume()" />
    <ul data-role="listview" data-inset="true">
        <li data-role = "list-divider">Songs</li>
        <li><a href="#" onclick="changeSong('Beethoven-Symphony5-1')">01 Symphony 5</a></li>
        <li><a href="#" onclick="changeSong('Beethoven-violin-sonata1-1')">02 Sonata 1</a></li>
        <li><a href="#" onclick="changeSong('bizet-jeux-d-enfants-poupee')">03 Bizet</a>     
    </ul>
    <img src="img/Beethoven2.jpg">
    <div data-role="footer" data-position="fixed">
    <output id="timeOut">Elasped Time:</output>
</div>