title: On-click Placing Text into input boxes
body: <p>On the page you click on a button(image) and text appears. When the text appears, you click on that text and I would like for it to appear in the input boxes.  For example, you click on image red.jpg, text will appear next to it that reads 'Fruit scents.' When you click on "Fruit Scents" I want it to appear in the intput boxes. I would like for this to happen in order from box 1 - box 3 and if the first box is full to go into the second. I'm not very good with using arrays so I'm not sure where to begin. This is all the code I have: </p>
  
  <pre><code> &lt;script&gt;
     var current_obj='';
     function showLinks(objID) {
     var obj=document.getElementById(objID); if (current_obj.style) {
     current_obj.style.display='none'; }
     obj.style.display='block';
     current_obj=obj; }
  &lt;/script&gt;
  
  &lt;style type="text/css" media="all"&gt; 
     .showhide_element {
      display: none; }
     html {
     background-repeat:no-repeat;
     background-size:100% 100%;
     height: 100%;
   }
  
     #container{width:1950px;}
     #container div{float:left;width:300px;margin-left:10px;margin-right:10px}
  
     div#Contact {
  background: #FFF;
  margin-left: auto;
  margin-right: auto;
  padding: 50px;
  width: 1000px;
  height:800px;
  border-radius:25px;
  -moz-border-radius:25px;
  }
  div#Contact_Text {
  background: yellow;
  }
  div.Contact_Button {
  background: white;
  height: 500px;
  margin-top: 100px;
  width: 96px;
  border:2px dotted;
  border-radius:25px;
  -moz-border-radius:25px;
  }
  div.test {
  
  align:right;
  }
  #container #Contact .Contact_Button {
  color: #909090;
  }
  
  
  #FruitsMenu_info {
  
  
  
  width:96px;
  height:500px;
  }
  
  
  #FloralsMenu_info {
  
  
  
  width:96px;
  height:500px;
  }
  div.Contact_Button2{
  
  background: white;
  height: 500px;
  margin-top: 100px;
  width: 96px;
  border:2px dotted;
  border-radius:25px;
  -moz-border-radius:25px;
  }
  div.Contact_Button3{
  
  background: white;
  height: 500px;
  margin-top: 100px;
  width: 96px;
  border:2px dotted;
  border-radius:25px;
  -moz-border-radius:25px;
    }
     &lt;/style&gt; 
     &lt;/head&gt; 
  
     &lt;body  bgcolor="#ade0fa"&gt;
  
     &lt;div id="container"&gt;
     &lt;div style="position: absolute; z-index: 5000; top: 24px; left: 22px;"&gt;&lt;img                 
  
     src="customize.jpg" width="288" height="100" /&gt;&lt;/div&gt;
  
     &lt;div id="Contact"&gt; 
  
     &lt;div class="Contact_Button"&gt;
     &lt;p align="center"&gt;&lt;b&gt; &lt;font color:"#a6a6a6"&gt;Select a Scent Category&lt;/font&gt;&lt;/b&gt;&lt;/p&gt;
  
     &lt;a href="#" onClick="showLinks('FruitsMenu_info');return false;"&gt;&lt;div 
     style="position:     
  
     absolute;width:134px; z-index: 5000; top: 200px; left: 120px;"&gt;&lt;img src="red.jpg"  
  
     width="132" height="43" /&gt; &lt;/div&gt;&lt;/a&gt;
  
  
      &lt;a href="#" onClick="showLinks('FloralsMenu_info');return false;"&gt;&lt;div   
      style="position:  
  
     absolute;width:134px; z-index: 5000; top: 240px; left: 120px;"&gt;&lt;img src="Florals.jpg" 
  
     width="132" height="43" /&gt;&lt;/div&gt;&lt;/a&gt;
  
     &lt;/div&gt;
  
     &lt;div class="Contact_Button2"&gt;
     &lt;p align="center"&gt;&lt;b&gt; &lt;font color:"#a6a6a6F"&gt;Choose 3 Scents &lt;/font&gt;&lt;/b&gt;&lt;/p&gt;
  
     &lt;div style="z-index: 5000; top: 540px; left: 220px;"id="FruitsMenu_info"  
  
     class="showhide_element"&gt;
  &lt;p align="center"&gt;&lt;font color:"#000000"&gt;Fruits Scents&lt;/font&gt;&lt;/p&gt;&lt;/div&gt;
  
     &lt;div style="z-index: 5000; top: 540px; left: 220px;"id="FloralsMenu_info" 
     class="showhide_element"&gt;&lt;p align="center"&gt;&lt;font color:"#000000"&gt;Floral Scents&lt;/font&gt;
     &lt;/p&gt;&lt;/div&gt;
  
  
  &lt;/div&gt;
  
  
  
  &lt;div class="Contact_Button3"&gt;
    &lt;p align="center"&gt;&lt;b&gt; &lt;font color:"#a6a6a6"&gt;Your Blend&lt;/font&gt;&lt;/b&gt;&lt;/p&gt;
      &lt;form id="form1" name="form1" method="post" action=""&gt;
        &lt;input type="text" name="Scent 1" id="Scent 1" /&gt;
        &lt;label for="Scent 1"&gt;&lt;/label&gt;
        Scent 1 
  
        &lt;input name="Scent 2" type="text" /&gt;
        Scent 2
        &lt;input name="Scent 3" type="text" /&gt;
        Scnet 3 
      &lt;/form&gt;
  
  &lt;/div&gt;
  
    &lt;/div&gt;
    &lt;/div&gt;
    &lt;/body&gt; 
    &lt;/html&gt;
  </code></pre>