JSFiddle - React, Tailwind, and code Playground
HTML
<div id="top"></div>
<button id="sp">Add Span</button>
<button id="dv">Add Div</button>
JavaScript
$(function() {
$.fn.elementInserted = function(pattern, fn) {
return this.bind('DOMNodeInserted', function(event) {
if (event.target.nodeType != 1) return;
$(event.target).filter(pattern).each(fn);
});
};
$('#top').elementInserted('div', function() {
$(this).css('background-color', 'blue');
});
$(document).elementInserted('#top span', function() {
$(this).css('background-color', 'green');
});
var i = 0;
$('#sp').click(function() {
var x = $('<span/>').attr('foo', ++i);
x.appendTo($('#top'));
x.attr('bar', i);
x.text('x' + i);
});
$('#dv').click(function() {
var x = $('<div/>').attr('foo', ++i);
x.appendTo('#top');
x.attr('bar', i);
x.text('x' + i);
});
});