title: Is there a way to generate 25 functions while incrementing them instead of writing each one?
body: <p>Is there a way to have this entire code be generated by a for loop? or another better option while incrementing the name of the function pic[i] and the names of the two files reading_[i]  &amp; track_[i]?</p>
  <pre><code>    function pic1()
      {
          document.getElementById(&quot;img&quot;).src = &quot;images/reading_1.JPG&quot;;
          document.getElementById(&quot;aud&quot;).src =&quot;audio/track_1.mp3&quot;;
      }
      function pic2()
      {
          document.getElementById(&quot;img&quot;).src =&quot;images/reading_2.JPG&quot;;
          document.getElementById(&quot;aud&quot;).src =&quot;audio/track_2.mp3&quot;;
          
      } 
      function pic3()
      {
          document.getElementById(&quot;img&quot;).src = &quot;images/reading_3.JPG&quot;;
          document.getElementById(&quot;aud&quot;).src =&quot;audio/track_3.mp3&quot;;
      }
  //.......
  //all the way to pic25()
  //.....
     
      function pic25()
      {
          document.getElementById(&quot;img&quot;).src =&quot;images/reading_25.JPG&quot;;
          document.getElementById(&quot;aud&quot;).src =&quot;audio/track_25.mp3&quot;;
      } 
  </code></pre>