title: jquery click trigger really slow because of document ready and large DOM
body: <p>I want to have both the <strong>radio button checked</strong> and <strong>radio button click</strong> event when the particular <strong>table data cell</strong> is clicked. I have achieved that using:</p>
  
  <pre><code>$(document).ready(function() {
      $("td").click(function(e) {
          var chk = $(this).closest("td").find("input:radio").get(0);
          if (e.target != chk) {
              chk.checked = !chk.checked;
          }
          var chkid = $(this).closest("td").find("input:radio").attr("id");
          $("#" + chkid).click();
      });
  });
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/bBHpF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/bBHpF.png" alt="enter image description here"></a></p>
  
  <p>My <code>$("td").click()</code> function works only when i embed in <strong>document ready</strong>. But, since its triggering the click event only in <strong>document ready</strong>, its being triggered after 6 seconds or more. I need the click event because it is rendering <code>css</code> and all the <strong>table data logic</strong> is being rendered with the click. Any way to shorten this lag will be very much appreciated. </p>