Will this code always work?

Question

$('#container').append('<div id="theonly">tests</div>').find('#theonly');

and

$('#container').html('<div id="theonly">tests</div>').find('#theonly');

I sometimes worry that dynamically generated elements are not available right away, am I wrong or not?

If I am not mistaken, what solution should cover all cases?

EDIT Can anyone come up with a definite and unified answer?

Answer 1

In the DOM world, anyone who answers this question with a yes is insane.

The function html(val)replaces directly innerHTML, so theoretically this code should always work, since it #containerwill actually have a new html code at the time of the callfind()

DOM , - . , , .

: : " ?"

, . , , , .

, , HTML , , html() html, .

- :

(function ($) {
    $.fn.htmlX = function (html, callback) {
        var element = this;
        var poll = function () {
            if (element.html() === html) {
                callback();
            } else {
                setTimeout(poll, 100);
            }
        };

        element.html(html);
        poll();
    };

    $('#container').htmlX('<div id="theonly">tests</div>', function() { $('#container').find('#theonly').css('color', '#f00'); });
}(jQuery));