jquery event fires before element exists
<p>I am trying to set checkbox states based on whether an element is included on the page. This element is inserted server-side. I am using client side script because the actual data values are stored client-side in cookies.</p>

<pre><code>    //set checkbox states on page load if first visit by user
    $("input:checkbox").each(function () {
        if ($("#userdataexists").attr('value') == 'true') {
            var cookiename = $(this).parents('label').attr('id');
            if (Cookies[cookiename]) {
                $(this).attr('checked', true);
            }
        }
    });
</code></pre>

<p>My problem is not with the code, my problem is that the page element '#userdataexists' does not seem to exist yet when the .each bound anonymous functions fire. I was under the impression that because my code is in '$(document).ready' that the DOM should be complete and all page elements should be created. However, in Chrome debugger if I stick in a breakpoint at the if statement and punch $("#userdataexists") I get a null object returned. If I wait until the page finishes loading then I get an object.</p>

<p>Can someone help me understand the order of events and why my object is null?</p>
