title: Secret button on website
body: <p>I am looking for a way to implement a 'secret' button in a page.
  Of course, I could just use CSS to hide the element like this:</p>
  
  <p><em>HTML</em>   </p>
  
  <pre><code>&lt;div class="secretButton" onclick="secretFunction()"&gt;&lt;/div&gt;
  </code></pre>
  
  <p><em>CSS</em></p>
  
  <pre><code>.secretButton {
      width: 100px;
      height: 100px;
      opacity: 0.5;
  }
  </code></pre>
  
  <p><em>JS</em> </p>
  
  <pre><code>function secretFunction() {
      alert("Secret Alert");
  }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/Nb2nf/" rel="nofollow">JSFIDDLE</a></p>
  
  <p>But this could too easily be seen in a web inspector.
  <strong>What would be the best way to create a such 'secret' element, where security does not matter?</strong></p>
  
  <p>Perhaps loading an encrypted script containing the 'secret' function <code>onclick()</code>?</p>
  
  <p><em>Note 1: jQuery can be used.</em></p>