Problem with setting field name

Thanks for your help so far on this - I think I'm getting there - but I think I've hit another snag!

The problem is that I have multipl ckEditor instances running in this particular form.

The form consists of two fields, both of which contain 'copy' text (i.e. descriptive text that needs to be formatted for output). The first field is called 'keynote', the second is called 'description'.

When the page loads, it displays two divs showing the current, formatted data.

When I click 'edit', it runs the following script:

$('.copy_field').each(function(){
      $(this).ckeditor()
      });

So far, so good - it works.

I'm planning on using the script you outline above and converting it to jquery - basically getting the value of the editor (using editor.getData()) and appending it to a hidden input value. One input called 'keynote', another called 'description'.

In theory, my code looks like this when 'save' is clicked (using an 'each' loop as above)

var field = $(this).attr('name')   //get the name of the ckEditor instance
var newCopy= $(this).editor.getData(); //get the value of that instance**
$(':input[name=field]').val(newCopy) //find an input with the same name as the ckEditor instance, set the value to that of the new data inputted

**I have a suspicion this line won't work as I've not fully checked out the syntax for getData() - feel free to point me in the right direction!

The problem is that the editor instance does not have a name!
Using the code I found here: http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.editor.html#name
I've added some alerts to my initial 'edit' functionality so the code looks like this:

      $('.copy_field').each(function(){
      var field_name = $(this).attr('name');   //returns name of div successfully
      alert(field_name)         //puts name of div in variable, triggers alert
      $(this).ckeditor({
         name: field_name      //assigns that name to name of instance**
         });
      alert(CKEDITOR.name);      //returns name of instance
      });

**This is the bit that's not working for me - as far as I can tell in the documentation, this code should work - but it's not.
Even without that line, just returning CKEDITOR.name gives me 'undefined', so to an extent, I'm back to my original question - how do I define the name of my ckEditor instances!

Thanks in advance for your help on this!

//define url for form submission & reset
//requires identified (isbn) to display/update correct data

var url = '<?php echo $_SERVER["PHP_SELF"].'?isbn='.$edition['edition_isbn13'];?>';

$(document).ready(function(){
//make form editable
//i.e. convert divs into ckEditor instances
   
   //when you click the edit button
   $(':button#edit').click(function(){
      
      //find the divs with a class 'copy_field'
      $('.copy_field').each(function(){
      
      //get the name from the div and apply it to the ckEditor
      var field_name = $(this).attr('name');
         //alert(field_name)
         $(this).ckeditor({
            name: field_name
         });
      });
      
      //when the page is in edit mode, you don't need an 'edit button
      //you need a save button and a 'reset' or 'cancel' button.
      //hide edit, show 'save' and 'reset'
      $(this).hide();
      $('#save_button').show();
      $('#reset').show();
      
   });
      //if they click 'reset', reload the original data
      //url is defined at the top of the script
      $(':button#reset').click(function(){
         $('.ui-tabs-panel:visible').load(url);
      });
   
      //changes have been made - they click the 'save'/'submit' button
      $('#admin_form').submit(function(e){
      
         //prevent the page from loading normally
         e.preventDefault();
         
         //update the original element
         for ( instance in CKEDITOR.instances ) {
            CKEDITOR.instances[instance].updateElement();
         }
      
         //find the updated divs with the class 'copy_field' (as per 'for' loop above)
         //create new form elements for posting
         $('div.copy_field').each(function() {
         $('#admin_form').append('<input type="hidden" name="'+$(this).attr('id')+'" value="'+$(this).html()+'"/>');
      });
   
   
      //perform the ajax query
      var str = $(this).serialize();
      $.ajax({
         type: "POST",
         url: url,
         data: str,
         success: function(data) {
            $('.ui-tabs-panel:visible').html(data); // update the DIV
            
         },
          error: function(e, xhr)
          
         {
            console.log(e);
            
         }

      });
   }); //end admin submit function
});

$('div.copy_field').each(function() {
         $('#admin_form').append('<input type="hidden" name="'+$(this).attr('id')+'" value="'+$(this).html()+'"/>');
      });