javascript - Handle stuff after dom changes -

For example:

I found a page with some javascript / jQuery stuff:

  (Function ()) ($ ('. Tip'). Tooltip (); $ ('test'). Click (function () (warning ('clicked!')})}} ();   
 On the page I insert some HTML with jQuery so that the changes in the DOM. For example, I insert an additional element with class "tip" or "test". Do not do jQuery because of non-header Working with DOM and not just the elements that were cast, I searched for this solution for "click":  
  $ ('body'). (' Click ',' click ', function () {warning (' clicked! '}});   
 I do not understand, but doing this like this The manipulative dom and jQuery stuff work on new inserted elements. So my first question is, why does this work and not just the click () function Land? And second question, I "body"?  
 Finally, my third question is, how did it with live and Tooltip?  
 I know that there is so much information about this subject (I've read the previous rep (and) the live () function) but I could not find any explanation about it.  
  Additional question:   
  / P> 
 4) Is it always to focus on "body" for such situations Is advised? It always happens there but for potential performance issues?  
 
 
 
 So my first question is, why does it work and just click () function is not?   
 Because the event handler is now handed over to a basic element, so it remains even after replacing / manipulating child elements.  
 Old articles for your observation on event delegation - but the concepts are the same:  
 
   
 
 And the second question Why do I have to "body" to indicate   
 You do not do, what any appropriate parent will do? For example, any direct parent (for example an ep rapper who does not   get)  
 
 Finally, my third question is how is this tooltip done?   
 You have to restart your tooltip plug-in on newly entered elements. For example:  
  $ Get ("foo.html", function (html) {$ ("# someDiv"). Html (html); $ ("# someDiv"). (".tip"). Tooltip ();});