Making Jeditable Working On New Elements

I'm trying to make Jeditable works on new elements created using this jquery file tree. On right click on a folder or file a context menu is shown and after clicking 'Rename' item

Solution 1:

you can use .on() in place of .live() which works sort of like the .delegate() method. live is bit expensive as it keep track of the DOM changes and for that it has to iterate where as the .on() or .delegate() simply delagate the event to a higher element like document or the body.

    $('.editableItem').live('click', function(){
        $(this).editable("http://www.example.com/save.php", {
     event: 'edit1',
     });
   });

Why you have to use live?

Because dynamically inserted elements into the DOM dont get attached to the event handlers automatically for that you have to use live or upon insertion of elements you can manually bind the elements to the event handlers by using .bind()

here are some useful questions

Difference between jQuery `click`, `bind`, `live`, `delegate`, `trigger` and `on` functions (with an example)?

Jquery live() vs delegate()

http://paulirish.com/2010/on-jquery-live/