title: Uncaught RangeError: Maximum call stack size exceeded in jquery trigger function
body: <p>Why does this code give me an error when the <code>trigger</code> function executes? Please tell me the solution.</p>
  
  <pre><code>&lt;input /&gt;
  &lt;input /&gt;
  &lt;div id='dd'&gt;&lt;/div&gt;
  </code></pre>
  
  <pre class="lang-js prettyprint-override"><code>x = $('input');
  x.on("input", function() {
    n = $(this).val();
  
    if (x.eq(0).val() == n) { 
      $('#dd').html(n); 
    }
  
    if (x.eq(1).val() == n) {
      x.eq(0).val(n);
      x.eq(0).trigger("input");
    }
  });
  </code></pre>
  
  <p>This jQuery code gives me an error in the browser console, but I don't know why.</p>
  
  <blockquote>
    <p>jquery-3.4.1.min.js:2 Uncaught RangeError: Maximum call stack size exceeded<br>
            at String.replace ()<br>
            at Function.htmlPrefilter (jquery-3.4.1.min.js:2)<br>
            at k.fn.init. (jquery-3.4.1.min.js:2)<br>
            at _ (jquery-3.4.1.min.js:2)<br>
            at k.fn.init.html (jquery-3.4.1.min.js:2)<br>
            at HTMLInputElement. (userscript.js:5)<br>
            at HTMLInputElement.dispatch (jquery-3.4.1.min.js:2)<br>
            at HTMLInputElement.v.handle (jquery-3.4.1.min.js:2)<br>
            at Object.trigger (jquery-3.4.1.min.js:2)<br>
            at HTMLInputElement. (jquery-3.4.1.min.js:2)  </p>
  </blockquote>