Hi, I've been experimenting with this plugin http://valums.com/edit-in-place/, so far so good... But i ran into this problem. I want to update my page when update or new request to save data is sent but if i update this function(editableText) it will add second set of buttons, third, fourth and so on. How could i tell it that it would update just on that returned data, but not all elements? I have an idea it has to do something with each function of jquerys, but I'm not sure as I'm quite new to jquery. Thanks for any help!

1. $.fn.editableText = function(options){
           var options = $.extend({}, $.editableText.defaults, options);
           
           return this.each(function(){
               // Add jQuery methods to the element
               var editable = $(this);
               
               /**
                * Save value to restore if user presses cancel
                */
               var prevValue = editable.html();
               
               // Create edit/save buttons
               var buttons = $(
                   "<div class='editableToolbar'>" +
                       "<a href='#' class='edit'></a>" +
                       "<a href='#' class='save'></a>" +
                       "<a href='#' class='cancel'></a>" +
                   "</div>")
                   .insertBefore(editable);
                   
               
               // Save references and attach events            
               var editEl = buttons.find('.edit').click(function() {
                   startEditing();
                   return false;
               });                            
               
               buttons.find('.save').click(function(){
                   stopEditing();
                   editable.trigger(options.changeEvent);
                   return false;
               });
                           
               buttons.find('.cancel').click(function(){
                   stopEditing();
                   editable.html(prevValue);
                   return false;
               });        
               
               // Display only edit button            
               buttons.children().css('display', 'none');
               editEl.show();            
               
               if (!options.newlinesEnabled){
                   // Prevents user from adding newlines to headers, links, etc.
                   editable.keypress(function(event){
                       // event is cancelled if enter is pressed
                       return event.which != 13;
                   });
               }
               
               /**
                * Makes element editable
                */
               function startEditing(){               
                   buttons.children().show();
                   editEl.hide();
                                   
                   editable.attr('contentEditable', true);
               }
               /**
                * Makes element non-editable
                */
               function stopEditing(){
                   buttons.children().hide();
                   editEl.show();                
                   editable.attr('contentEditable', false);
               }
           });
       }
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   

What should i change in this code that this function would run only one time? How to change "return this.each?