页面导航的if条件出现问题

$( 'li' ).on( 'click', function( event ) {
            console.log("inside music player");
            var projIndex = $(this).index();
            selectedMedia=$(this).text();
            console.log("------"+projIndex);
            console.log("------"+selectedMedia);
            var extension = selectedMedia.substr( (selectedMedia.lastIndexOf('.') +1) );
            console.log("extension-----"+extension);
            if(extension=="mp3" || extension=="wav")
                {
                var musicLink="#musicPlay_page";
                var selectedLink = document.getElementById('mediaLink'); 
                selectedLink.href=musicLink;
                $('#musicPlay_page').add(playMusicList(selectedMedia));
                }                         
            else if(extension=="mp4")
                {
                var videoLink="#videoPlay_page";
                var selectedLink = document.getElementById('mediaLink'); 
                selectedLink.href=videoLink;
                $('#videoPlay_page').add(playVideoList(selectedMedia));
            }
        });

在上面的代码中，我需要根据我选择的媒体类型(mp3或mp4)导航到两个不同的页面。如果是mp3，那么它应该导航到musicPlay页面，如果是mp4，它应该导航到videoPlay页面。它工作得很好，当我点击列表中的第一个文件，即它导航到其他页面，但当我点击列表的第一个元素以外，它不导航到其他页面，而是在当前页面本身播放文件，请解决这个问题。

function onsuccess(files) {
        $('#media_list').remove();
        var d='<div id="media_list">';
        d += '<ul data-role="listview" style="list-style: none outside none;padding: 0;">'
            +'<div style="font-weight:bold;color:black;">';
        for(var i = 0; i < files.length; i++) {
            console.log("File Name is " + files[i].name); // displays file name
            if(files[i].isDirectory == false){      
                d+='<li style="vertical-align: top;">'
                    +'<a href="" id="mediaLink">'
                    +'<img src="/images/musicPlay_logo.jpg" id="musicPlay"/>'
                    +files[i].name
                    +'</a><hr color="black" size =1 width=500></li>';
            }
        }
        d+= '</div>';
        d+= '</ul>';
        d+= '</div>';
        $("#media_content").append(d);

}

这是我用来显示HTML内容的函数它显示媒体文件列表，你可以看到在'a'标签中我将href留空所以点击时它会进入点击功能根据我点击的文件格式它会进入if条件页面应该会打开