JSFiddle - React, Tailwind, and code Playground

HTML

<div class="controls">
<input type="button" name="add" id="optionsRadios" value="add" onclick="addDIV()">
</div>
<div id="pairs">
</div>

JavaScript

var fc_globals = {
	words: "AB CD",
  pair_spacing: "&emsp13;",
	n: 1
};

function new_textarea(name, value){
		return "<input type='textarea' name='" + name + '>' + value + "</textarea>"
}

//window.onload = init_pairs()
(function(window, document, undefined){
	window.onload = init_pairs;
  function init_pairs(){
		var i;
    var words_ra = fc_globals.words.trim().split(' ');
    for (i = 0; i < words_ra.length; i++) {
    	alert(words_ra[i][0]);
      document.getElementById('pairs').innerHTML +=
         new_textarea("orig_" + i, words_ra[i][0]) +
	       fc_globals.pair_spacing;
    }
  }
})(window, document, undefined)

function addDIV() {
    //alert(i);   
    document.getElementById('pairs').innerHTML += 
    		//"<div id='pair_'" + fc_globals.n + "' />&emsp13;" +
            "<input type='textarea' name='orig_" + fc_globals.n + "' />" +
            "<input type='textarea' name='new_" + fc_globals.n + "' />" +
        "";//"</div>";
    fc_globals.n++
    var textareas = document.querySelectorAll('input[type="textarea"]');
		var text = ""
    //alert(text);
}