javascript - jquery function to access hidden divs -

the code below general template music page.

the slideshow moves song/image gallery forward or sequentially, alas, 'switchfeature' function, should allow jump various tunes listed in sidebar, doesn't seem working.

can point out error is, or needs done make work? thanks!

<!-- music.php -->  <?php require 'header.php' ?>      <script type="text/javascript">      $(document).ready(function() {          $(".tuneslides").hide();         var idname = ["#tune1", "#tune2"];         var indexnum = 0;         $(idname[0]).fadein(1000);          $("#slidenext").click(function() {             $(idname[indexnum]).fadeout(300, function() {                 indexnum++;                  if (indexnum > 1) {indexnum = 0;}                 $(idname[indexnum]).fadein(500);             });         });          $("#slideback").click(function() {             $(idname[indexnum]).fadeout(300, function() {                 if (indexnum == 0) {indexnum = 1;}                 else {indexnum--;}                   $(idname[indexnum]).fadein(500);             });         });          // alas...         function switchfeature (newindexnum) {             $(idname[indexnum]).fadeout(300, function() {                 $(idname[newindexnum]).fadein(500);                 indexnum = newindexnum;             });         };      });      </script>   <div id="sidebar">  <h2>featured tunes<br>(click show)</h2>  <p onclick="switchfeature(0)">tune 1</p> <p onclick="switchfeature(1)">tune 2</p>  </div><!--sidebar-->      <div id="main">  <div id="slideshow">      <div id="slideback">previous</div>     <div id="slidenext">next</div>      <div class="tuneslides" id="tune1">         <p class="tstitles">tune 1 </p>         <audio controls>             <source src="music/tune1.mp3" type="audio/mpeg">             <img src="images/image1.jpg"/>         </audio>     </div>      <div class="tuneslides" id="tune2">         <p class="tstitles">tune 2</p>         <audio controls>             <source src="music/tune2.mp3" type="audio/mpeg">             <img src="images/image2.jpg"/>         </audio>     </div>  </div> <!-- slideshow -->  </div><!--main-->  <?php require 'footer.php' ?> 

you defined switchfeature within scope of

$(document).ready(function(){ }); 

meaning switchfeature in different scope onclick event trying call.

try define function following, , see if works:

window.switchfeature = function(newindexnum) {    $(idname[indexnum]).fadeout(300, function() {       $(idname[newindexnum]).fadein(500);       indexnum = newindexnum;    });  };