title: Getting the "RangeError: Maximum call stack size exceeded" error
body: <p>I am getting this JavaScript error in Chrome:</p>
  
  <blockquote>
    <p>RangeError: Maximum call stack size exceeded
    [http://localhost:5545/assets/js/jquery.min.js:2]</p>
  </blockquote>
  
  <p>With this <code>click</code> event:</p>
  
  <pre><code>$('.accept-answer-button').click(function() {
      var id = $(this).parent().parent().attr('id').replace('answer_', ''),
          b = this;
      if ($('.accepted').length &gt; 0) $('.accepted').click();
      AP.AcceptAnswer(id, $(b));
  });​
  </code></pre>
  
  <p>The code for <code>AP.AcceptAnswer()</code> is:</p>
  
  <pre><code>AP.AcceptAnswer = function(a, o) {
      $.getJSON('/assets/ajax/accept-answer', {
          qid: qid,
          answer: a
      }, function(data) {
          if (data.success == true) {
              if (data.type == 'accepted') {
                  var title = o.attr('data-unaccept-title').replace('{t}', data.time);
                  o.addClass('accepted').attr('title', title);
              }
              else if (data.type == 'unaccepted') {
                  var title = o.attr('data-accept-title').replace('{t}', data.time);
                  o.removeClass('accepted').attr('title', title);
              }
          }
          else {
              alert(data.error);
          }
      });
  }; // end AP.AcceptAnswer()​
  </code></pre>
  
  <p>I am doing <code>$('.accepted').click();</code> just to unaccept the currently accepted answer (if there is one) when the user would like to accept another answer.</p>