JQuery - usando .on con la inserción del elemento

Question

Tengo una función que crea una información sobre herramientas para objetos específicos. Actualmente, estoy ejecutando una función de información sobre herramientas después de las inserciones ajax para crear y anexar los nuevos objetos de información sobre herramientas. Tengo curiosidad por saber si hay una forma de usar .on() para ejecutar automáticamente la función de información sobre herramientas en la inserción, en lugar de ejecutarla manualmente.

Por ejemplo:

$('[title]').on('inserted', function(){ 
    tooltip(this); 
}); 

he hecho un poco de lectura y parece que los factores desencadenantes personalizados podrían ser el camino a seguir, pero me encantaría si existía algo como esto :)

Answer 1

Aquí está el código seudo según la petición.

$(document).ready(function() { 
    $('body').on('added','*',function() { 
     console.log($(this),'has been added'); 
    }); 
    $('body').append('<div>This is the first div</div>'); 
}); 

(function($) { 
    fncs = { 
     append:$.fn.append, 
     appendTo:$.fn.appendTo 
     // etc. 
    } 
    // we're assigning the original functions in this 
    // object to be executed (applied) later 
    $.fn.append = function() { 
     fncs.append.apply(this,arguments); 
     $(this).children().last().trigger('added'); 
     return $(this); 
    } 
    $.fn.appendTo = function() { 
     fncs.appendTo.apply(this,arguments); 
     return $(this); 
     // no need to trigger because this function calls the one 
     // above for some reason, and it's taking care of the 
     // triggering the right element(s I think) 
    } 
})(jQuery); 

Answer 2

Esto es no es la respuesta que está buscando, pero no adjuntaría información sobre herramientas directamente sobre los elementos. En su lugar me gustaría utilizar una clase para los que quiero la información sobre herramientas para mostrar al pasar el ratón y utilizar el controlador de .on() evento de la siguiente manera:

$('body').on('mouseover','.tooltip',function() { 
    // show tooltip 
    console.log($(this).data('tooltip')); 
    return false; 
}).on('mouseout','.tooltip',function() { 
    // hide tooltip 
    return false; 
}); 

Así que todo lo que se agrega al cuerpo (no necesariamente como un niño directa) activará este controlador de eventos.

Probablemente crearía una función adicional para asignar los datos de información sobre herramientas a cada elemento junto con la clase.

$.fn.extend({ 
    tooltip:function(text) { 
     text = text || ''; 
     return $(this).each(function() { 
      $(this).data('tooltip',text).addClass('tooltip'); 
     }); 
    } 
}); 

$('#someID').tooltip("Click me!"); 
$('button').tooltip("I'm a button");