Unable to append an iamge

Unable to append an iamge

javascript file------
  
        var min=1;
        var max=99;
        
  function random()
         {  
          var rano = Math.floor(Math.random() * (max - min + 1)) + min;
          return rano;
         } 
 
 
  function run()
  {
     var i,temp;
     for(i=1;i<99;i++)
     {
      
         temp=i+"p";
         //the inner value would set but I am unable to attach a image to that tag where the text is added.
         document.getElementById(temp).innerHTML=i;
         document.getElementById(temp).prepend('<img id="theImg" src="logo.png" />')
     }
  }






















 

html file

<body onload="run()">
        <script type="text/JavaScript" src="script.js"></script>
 <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
 <div >
     <span id="1p"></span>     <span id="2p"></span>     <span id="3p"></span>
     <span id="4p"></span>     <span id="5p"></span>     <span id="6p"></span>
     <span id="7p"></span>     <span id="8p"></span>     <span id="9p"></span>
    
           //there will be many more span tag like this ..........till 99p
           // I want to add an image(out of 20 images) to all the span having id form 1p to 99p  .
           //but the requirement is that each time the file runs the position of all images shd change.
           //so I am looping through all the span tag and then I l generate a random number from 1 to 20 and associate the cossosponding image
           //to that tag.
           //  Issue-1.document.getElementById(temp).prepend('<img id="theImg" src="logo.png" />')
           //        I am using this to attach element to the tag but it won't happen
          














 </div>
   
</body>