动态修改元素

I've got some elements with the class .super-elem that I want to be adjusted somehow, let's say by adding attribute to it adjusted="true"

I could easily make something like this inside the document's ready event :

$(".super-elem").attr("adjusted", "true");

But I can add .super-elem elements later and I want them to be adjusted too.

So when I add .super-elem with AJAX, I can use some AJAX callback to make adjustments.

But - there are 1000s of different ways of adding new element to page like just

$("<div>").addClass("super-elem").appendTo("body");

Is there some way to make sure that any element, any time added or created, that have class .super-elem will also have needed adjustments?

My ideas are

  • timeout checking if there are elements without adjustments

setTimeout(function(){ adjust() }, 100);

  • some kind of DOM modified events

But I'm not sure if those are good solutions - I think they are totally bad for performance and also I don't feel the first one is really solid.

You can use a custom event that can be triggered every time you append or create a new .super-elem, e.g. :

...
$(".super-elem").append() //or whatever
$.event.trigger("superElemCreate");
..

$(document).on('superElemCreate', function() { 
});