title: Random image on button click
body: <p>I have a little problem with my code it should get all the picture names from my mysql database. Then when I click by button it should give me the next image and so on but it only works for the first image and second image.</p>
  
  <pre><code>include_once 'connect.php';
  
  $place="upload/";
  $first = mysql_query("SELECT * FROM images ORDER BY RAND()");
  
  while($wor = mysql_fetch_array($first))
  {
      $id=$wor['id'];
      $name = $wor['name'];
      $image = $place . $wor['name'];
  }
  
  $number="1";
  $wrongnumber="2";
  $r = mysql_query("SELECT * FROM images ORDER BY RAND()");
  echo '&lt;script&gt; ';
  
  while($wor = mysql_fetch_array($r))
  {
      $id=$wor['id'];
      $name = $wor['name'];
      $images = $place . $wor['name'];
      $number=$number + 1;
      $wrongnumber=$wrongnumber + 1;
  
      echo 'function ' . 'changeSrc' . $number . '() '; ?&gt;
  
  {
      document.getElementById("rand").src="&lt;? echo $images;?&gt;";
      document.getElementById("button").onclick="changeSrc&lt;? echo $wrongnumber;?&gt;()";
  }
  
  &lt;?
  }
  ?&gt; 
  
  &lt;/script&gt;
  &lt;img id="rand" src="&lt;? echo $image;?&gt;"&gt;&lt;br&gt;
  &lt;input id="button" type="button" onclick="changeSrc2()" value="Change image"&gt;
  </code></pre>
  
  <p>here are the output code:</p>
  
  <pre><code>&lt;script&gt; function changeSrc2() {
  document.getElementById("rand").src="upload/1329614460tumblr_lqd5m3svzy1qg7sdjo1_500- 450x299.jpg";
  document.getElementById("button").onclick="changeSrc3";
  }
  function changeSrc3() {
  document.getElementById("rand").src="upload/1349616418121.jpg";
  document.getElementById("button").onclick="changeSrc4";
  }
  function changeSrc4() {
  document.getElementById("rand").src="upload/1329614513beuty_ass_by_boobsaplenty-500x375.jpg";
  document.getElementById("button").onclick="changeSrc5";
  }
  function changeSrc5() {
  document.getElementById("rand").src="upload/1329614538tumblr_lqunpmqwkw1qd33kzo1_500-450x690.jpg";
  document.getElementById("button").onclick="changeSrc6";
  }
  function changeSrc6() {
  document.getElementById("rand").src="upload/1349619307women_panties.jpg";
  document.getElementById("button").onclick="changeSrc7";
  }
  function changeSrc7() {
  document.getElementById("rand").src="upload/1339140972sandy-marina-soccer-01.jpg";
  document.getElementById("button").onclick="changeSrc8";
  }
  function changeSrc8() {
  document.getElementById("rand").src="upload/1329614576tumblr_lsz0k0MLhT1qd33kzo1_500-450x495.jpg";
  document.getElementById("button").onclick="changeSrc9";
  }
  function changeSrc9() {
  document.getElementById("rand").src="upload/1329614539tumblr_lsaixi0igS1qd33kzo1_500-450x674.jpg";
  document.getElementById("button").onclick="changeSrc10";
  }
  function changeSrc10() {
  document.getElementById("rand").src="upload/1349619990tumblr_lrqx1vESE51qhatv8o1_500.jpg";
  document.getElementById("button").onclick="changeSrc11";
  }
  
  &lt;/script&gt;
  &lt;img id="rand" src="upload/1329614520daily_erotic_picdump_70-500x677.jpg"&gt;&lt;br&gt;
  &lt;input id="button" type="button" onclick="changeSrc2()" value="Change image"&gt;
  </code></pre>