Update DOM after insert in jQuery

ajax, jquery

Solution

Use live like this:

 $(".view").live("click",function(){
      $(this).parent().load("view");
    });

Problem

Let's say I use jQuery to load new content into a specific DIV element. If I now want to catch events from inside that DIV element, I assume the DOM has to be updated somehow? What is the best way to deal with this? Edit: Here is an example of what I mean: ``` <html> <head> <script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script> $(document).ready(function(){ $(".edit").click(function(){ $(this).parent().load("edit"); }); $(".view").click(function(){ $(this).parent().load("view"); }); }); </script> </head> <body> <div class='someid'> <input type='submit' class='edit' value='Edit'> </div> </body> </html> ``` where a file `edit` at the same level contains ``` <input type='submit' class='view' value='View'> ``` and a file 'view' contains ``` <input type='submit' class='edit' value='Edit'> ``` If you try this out you will see that when you first press Edit, the button changes to View, but then it doesn't change anymore. Why is this?

Original source