title: CKEditor 4 (replace by class name) get text area value
body: <p>I am trying to create a preview function in a CKEditor instance.</p>
  
  <p>I'm using CKEditor 4 and am replacing textareas by class name, the only issue I am facing is that I cannot get the value of the textarea using JavaScript, this is what I've tried so far:</p>
  
  <pre><code>function prev()
      {
          html=document.forms["1_form"]["editor1"].value;
          document.getElementById("prev").innerHTML = html;
      }
  </code></pre>
  
  <p>and the CKEditor textarea:</p>
  
  <pre><code>&lt;textarea class="ckeditor" onkeydown="prev()"&gt;&lt;/textarea&gt;
  </code></pre>
  
  <p>Why doesn't this work? If I disable CKEditor, the script functions as expected, but not with ckeditor enabled. What am I supposed to  do?</p>
  
  <p>Thanks!</p>
  
  <p>Edit:</p>
  
  <p>I am now trying to do it with replace and this is the code I'm using:
      CKEDITOR.replace('editor1'); //new ckeditor instance
      var editor = CKEDITOR.instances.editor1; //reference to instance</p>
  
  <pre><code>//on `key` event
  editor.on('key', function(){
  
  var data = editor.getData(); //reference to ckeditor data
  $('#prev').html(data); //update `div` html
  
  });
  </code></pre>
  
  <p>it works but the only this is, it updates only after the next key is pressed so say the value of the editor is <code>hello world</code> it will show the preview as <code>hello worl</code> what can I do to this code to fix it, please ignore the first set of code.</p>