title: Content shows up when clicked on the link
body: <p>I am generating content when clicking on the img a href link similar to this site on the navigation button similar to this site <a href="http://www.google.com.ph/nexus/" rel="nofollow">http://www.google.com.ph/nexus/</a>. </p>
  
  <p>I've tried using :after and content: pseudo elements but the content can only show a link. How would I show a div when I clicked on the link.</p>
  
  <p>I would like to generate a div when I clicked on the navigation icon similar to this site <a href="http://www.google.com.ph/nexus/" rel="nofollow">http://www.google.com.ph/nexus/</a>. my fiddle <a href="http://jsfiddle.net/" rel="nofollow">http://jsfiddle.net/</a>. How would I go about achieving this. I want to generate content through a particular div instead of a link. Any help would be appreciated.</p>
  
  <p>here is my html</p>
  
  <pre><code>&lt;div id="center"&gt;
      &lt;ul&gt;
  &lt;li&gt;    
      &lt;p&gt;
      &lt;a href="http://www.google.com.ph/nexus/"&gt;
      &lt;img src="https://cdn2.iconfinder.com/data/icons/flat-ui-icons-24-px/24/menu-24-24.png"&gt;
      &lt;/a&gt;
  &lt;/li&gt;
  
  &lt;/div&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>here is the design css </p>
  
  <pre><code>ul li
  {
      list-style:none;
  }
  li a
  {
      content:url("https://cdn2.iconfinder.com/data/icons/flat-ui-icons-24-px/24/menu-24-24.png");
  }
  </code></pre>