onclick is being called continuously
<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>