HTML点击图片播放音乐方法为什么调用不了

想问一下下面代码想实现点击图片播放音乐方法，为什么报错提示找不到方法啊，调用不了
HTML

<div>
        <img id="musics" onclick="button()" src="img/logo.png"  >
        <audio id="music"  autoplay="autoplay" loop="loop" src="music/impreza.mp3" ></audio>
    </div>

js

var music = document.getElementById('music')    //获取音乐
var musics = document.getElementById('musics')   //获取音乐图标
var tem = true  //设置一个变量，用来控制音乐是否在播放。
function button(){
    //tem用来控制音乐当前是否在播放。true代表音乐正在播放，false代表音乐当前正在处于暂停的状态。
    if(tem == false){
        music.play()  //播放音乐
        tem = true  
        document.getElementById('musics').style.animationPlayState = 'running'  //播放音乐图标
    }else{
        music.pause()  //暂停音乐
        tem = false
        document.getElementById('musics').style.animationPlayState = 'paused'  //暂停音乐图标
    }
}

代码没有问题，js引用是正确的吗