With jQuery, how can I use the "live" method to alert when a new element is added?

First off, I don't want another plugin to do this... jQuery already has the functionality to do 99% of what I want with the live() method.

Basically, I want to change this:

$(".some-button").live("click", function() { alert('yay!'); });

into this:

$(".some-button").live开发者_运维技巧(function() { alert('yay!'); });

So, what I'm saying is that I want to fire a method right away when an element is added to the page... jQuery can already do this SOOO close because that's how it adds the "click" even in my example above!

How can I achieve this without adding another plugin, but rather, just by using the same functionality as the "live" and "die" methods do?

Here's some code I've copied and pasted that seems to work in fiddle, at least on FF: http://jsfiddle.net/KQBzn/

$(document).bind('DOMNodeInserted', function(event) {
      alert('inserted ' + event.target.nodeName + // new node
            ' in ' + event.relatedNode.nodeName); // parent
});

source: http://forum.jquery.com/topic/how-to-get-notified-when-new-dom-elements-are-added

There isn't any cross-browser way to do this, and there's nothing in jQuery itself that allows it.

You'd have to use a plugin, or just manage invoking code for your new elements manually.

The the live()^[docs] method and the delegate()^[docs] method are only for event handling. The code you give them will only respond to browser events, not to DOM manipulation.

The reason .live() won't do this is because it does not run any code when adding new elements to the DOM. It isn't monitoring any DOM changes. Rather it is responding to events that bubble to the document, and invoking the handler if it matches the selector you gave it.

You can't do it with the .live() method.

It seems jQuery should add a feature to the .live() method so that if its used with a specific keyword like 'created' instead of an event name then it will let you execute a function for the created element. That'd be cool! For example, the ideal scenario would be like this:

$('.foobar').live('created', function() {
    // do something with each newly created .foobar element here.
});