Suppose I am having a DOM structure like this, <body> <!– Dom elements –>

Question

0

Asked: May 23, 20262026-05-23T21:31:37+00:00 2026-05-23T21:31:37+00:00

Suppose I am having a DOM structure like this, <body> <!– Dom elements –>

0

Suppose I am having a DOM structure like this,

<body>
    <!-- Dom elements -->

    <div class="red"></div>
    <div class="red"></div>
    <div class="red"></div>

    <!--More Dom elements -->
</body>

You can see there are three elements with class= red. Now suppose of because some user activity two more elements are added to DOM like below.

<body>
    <!-- Dom elements -->

    <div class="red"></div>
    <div class="red"></div>
    <div class="red"></div>

    <div class="red"></div> <!--New element added because of some user activity -->
    <div class="red"></div> <!--New element added because of some user activity -->

    <!--More Dom elements -->
</body>

Now i want some mechanism that whenever news elements get added to DOM they report to a function.

Below is a hypothetical function iam looking for

jQuery('.red').onAddedToDom_AfterDomReady(function(){
               //do something to all added elemnents
               //like bind some events to them etc
});

Is there any existing feature in jQuery that iam missing or any plugin that may help!!