title: onclick is being called continuously
body: <p>I have some HTML:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;div onclick="postClick()" class="btn-simple" id="button"&gt;Solve&lt;/div&gt;
  &lt;div id="message"&gt;
    &lt;p&gt;&lt;/p&gt;
  &lt;/div&gt;
  &lt;script&gt;
    function postClick() {
      answers = ["A", "B", "C"]
      rand = answers[Math.floor(Math.random() * answers.length)];
      document.getElementById("message").innerHTML = "&lt;p&gt;" + rand + "&lt;/p&gt;";
      $.ajax({
        type: 'POST',
        url: 'somefile.php',
        dataType: 'text',
        success: function(msg) {
          if (msg) {
            window.location = msg;
          }
        }
      });
    }
  &lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Before I click on the button the first time, everything is fine.
  But once I have clicked the button, the display just randomly cycles through the answers automatically, as if I would click on the button every half second or so. What I want is a different answer displayed every time I click.</p>
  
  <p>What am I doing wrong?</p>
  
  <p>Edit:</p>
  
  <p>If I log the caller of the function, via </p>
  
  <pre><code>arguments.callee.caller.toString()
  </code></pre>
  
  <p>it is the button click:</p>
  
  <pre><code>function onclick(event) { postClick() }
  </code></pre>