CKeditor com áreas de texto dinâmicas multible
Eu tenho um formulário que permite o envio de várias etapas. Quando um usuário clica em "adicionar etapa", outra área de texto é exibida. Estou usando o CKeditor. Ele funciona muito bem na primeira iteração, mas em todas as subseqüentes, mostra uma área de texto padrão. Aqui está o meu código:
<form method="post" action="process_project.php">
<b>Steps for your project:</b>
<div> </div>
Step 1
<div id="divWho">
<textarea name="projSteps[]" class="steps" id="1" rows="10" cols="60"></textarea>
</div>
<div> </div>
<input type="button" value="Add project step" onClick="addTextArea();">
<input type="submit" name="submit" value="submit" />
</form>
<script type="text/javascript">
var counter = 1;
var limit = 11;
function addTextArea() {
if (counter == limit-1) {
alert("You have reached the limit of adding " + counter + " project steps");
return false;
}
else {
var newdiv = document.createElement('div');
newdiv.innerHTML = "Step " + (counter + 1) + " <br><textarea name='projSteps[]' id=counter rows='10' cols='60'>";
document.getElementById('divWho').appendChild(newdiv);
counter++
return true;
}
}
</script>
<script> CKEDITOR.replace('1');</script>
Como posso fazer com que cada nova área de texto criada dinamicamente também use o CKeditor? Estou trabalhando nisso há horas e estou perplexo.