title: How to show a text when hovering?
body: <p>I have a footer in which I have different icons for my social media. Now, I want to create a hover effect, which displays the name of hovered icons. </p>
  
  <p>For example: My mouse is over the facebook icon, and then the text 'Facebook' should come up in a div, located in a div below!</p>
  
  <p>I know how to create this, however, I don't know how I display these names in the same div at the exact same place. How can I do this? </p>
  
  <pre><code>&lt;div id="footer1" style="position: fixed; bottom: 0;"&gt;
      &lt;div class="content-wrapper"&gt;
        &lt;div class="ft-div-left"&gt; &lt;/div&gt;
        &lt;div class="ft-div-right"&gt;
          &lt;p&gt;&lt;/p&gt;
        &lt;/div&gt;
        &lt;div class="ft-div-middle"&gt;
          &lt;center&gt;
            &lt;p&gt;
              &lt;center&gt;
                &lt;a href="" style="text-decoration:none; color:white;"&gt;&lt;span class="" style="color: white;"&gt;&lt;/span&gt;&lt;/a&gt; 
                &lt;a href=""  style="text-decoration:none; color:white;"&gt;&lt;span class="" style="color: white;"&gt;&lt;/span&gt;&lt;/a&gt; 
                &lt;a href="" style="text-decoration:none; color:white;"&gt;&lt;span class="icon-stumbleupon3" id="issuu" style="color: white;"&gt;&lt;/span&gt;&lt;/a&gt; 
                &lt;a href="" style="text-decoration:none; color:white;"&gt;&lt;span class ="icon-twitter3"&gt;&lt;/span&gt;&lt;/a&gt;
                &lt;/br&gt;
                &lt;br&gt;
                &lt;br&gt;
                &lt;span style="font-family:'Open Sans',sans-serif; font-size:11px; color:grey;"&gt;&amp;copy; 2014. All Rights Reserved.&lt;/span&gt;
              &lt;/center&gt;
            &lt;/p&gt;
          &lt;/center&gt;
        &lt;/div&gt;
        &lt;div id="hoverText"&gt;
           &lt;span&gt;Here goes the text&lt;/span&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  </code></pre>