title: Having problem implementing Javascript: Not working
body: <p>I'm having a little trouble and want to ask why my Javascript code is not working here. This is my HTML / CSS / Java Script code.</p>
  <p>I want to create a form with a small tooltip on user ID when user hover their mouse in input area, it will appear the &quot;Student ID&quot; box.</p>
  <p><strong>HTML</strong></p>
  <pre><code>        &lt;p&gt;Account Information&lt;/p&gt;
          &lt;p&gt; 
              &lt;label for=&quot;sid&quot; &gt;User ID&lt;/label&gt;
              &lt;input type=&quot;text&quot; name=&quot;sid&quot; id=&quot;sid&quot; /&gt;
              &lt;span id=&quot;sidTip&quot; class=&quot;tooltip&quot;&gt;Student ID&lt;/span&gt;
          &lt;/p&gt;
          
  </code></pre>
  <p><strong>CSS</strong></p>
  <pre><code>.tooltip {                      
      display                     : none;             
      position                    : relative;     
      background-color    : lightblue;    
      border-radius           : 5px;              
      text-align              : center;           
      padding                     : 5px;              
      left                            : 1em;              
  }
  .tooltip:after {            
      position                        : absolute;     
      top                             : 10px;             
      border-style                    : solid;
      height                          : 0;
      width                           : 0;
  }
  </code></pre>
  <p><strong>Javascript</strong></p>
  <pre><code>function showTip() {
      var sidTip = document.getElementById(&quot;sidTip&quot;);     
      sidTip.style.display = &quot;inline&quot;;                    
  }
  
  function hideTip() {                                    
      var sidTip = document.getElementById(&quot;sidTip&quot;);
      sidTip.style.display = &quot;none&quot;;                      
                                                          
  }
  
  function init() {                                       
      var sid = document.getElementById(&quot;sid&quot;);
      sid.onmouseover=showTip();                              
      sid.onmouseout=hideTip();                                               
                                                          
  }
  
  window.onload=init();
  </code></pre>