title: Adding CKEditor textareas dynamically
body: <p>I'm creating an app where users can upload files and add a description and file title for each file.</p>
  
  <p>I'm using jQuery to add more inputs dynamically, I wanted to add basic markup such as bold text, italic text, etc to the description and decided to use CKEditor.</p>
  
  <p>The first textarea works properly and gets initiated as soon as a user opens the page.</p>
  
  <p>However, the ones that I'm trying to add dynamically do not get initiated as a CKEditor textarea.</p>
  
  <p>I tried this script, but it doesn't work. Any help is appreciated.</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(document).ready(function() {
      var CKeditor = $(this).find('.dynamic-ckeditor-textarea')
      CKeditor.ckeditor()
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>This is the form I'm using.</p>
  
  <pre><code>&lt;div class="row bg-custom"&gt;
    &lt;div class="col-12"&gt;
      &lt;form class="add-post-form form-signin widthfix" enctype="multipart/form-data" action="upload-handler.php?id=&lt;?php echo $lastId; ?&gt;" method="post"&gt;
        &lt;ul id="fieldList"&gt;
          &lt;li&gt;
            &lt;input class="form-control topborder" type='file' name='postFile[]'&gt;
          &lt;/li&gt;
          &lt;li&gt;
            &lt;input class="form-control fixborder" type='text' name='postName[]' placeholder='File title / name'&gt;
          &lt;/li&gt;
          &lt;li&gt;
            &lt;textarea class='form-control fixborder' id="image-desc-editor" name='postDesc[]' placeholder='File description'&gt;&lt;/textarea&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
        &lt;button type="button" class="form-control" id="addMore" name="button"&gt;Another file&lt;/button&gt;
        &lt;br&gt;
        &lt;input type="submit" name=""  class="form-control" value="Upload files"&gt;
      &lt;/form&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This is the jQuery I'm using to add more inputs:</p>
  
  <pre><code>$(function() {
    $("#addMore").click(function(e) {
      e.preventDefault();
      $("#fieldList").append("&lt;li&gt;&amp;nbsp;&lt;/li&gt;");
      $("#fieldList").append("&lt;li&gt;&lt;input type='file' class='form-control topborder' name='postFile[]'&gt;&lt;/li&gt;");
      $("#fieldList").append("&lt;li&gt;&lt;input type='text' class='form-control fixborder' name='postName[]' placeholder='File title / name'&gt;&lt;/li&gt;");
      $("#fieldList").append("&lt;li&gt;&lt;textarea id='image-desc-editor' class='form-control fixborder dynamic-ckeditor-textarea' name='postDesc[]' placeholder='File description'&gt;&lt;/textarea&gt;&lt;/li&gt;");
    });
  });
  </code></pre>