JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" id="textfield1" value="foo" /> <br />

<input type="text" id="textfield2" value="foo" /> <br />

<input type="text" id="textfield3" value="foo" /> <br />

<input type="text" id="textfield4" value="foo" /> <br />

<select id="select1"> 
    <option>foo</option>
</select>
    <br />

copytextfield1:<input type="text" id="copytextfield1" value="" /> <br />
copytextfield2:<input type="text" id="copytextfield2" value="" /> <br />
copytextfield3:<input type="text" id="copytextfield3" value="" /> <br />
copytextfield4:<input type="text" id="copytextfield4" value="" /> <br />

JavaScript

var $foo = $("#textfield1, #textfield2, #textfield3, #select1");

$foo
    .on("keyup keypress blur click change", function(event) {
    
        //alert('f');
        var theNum = parseInt($(this).attr("id").match(/\d+$/)); // will return last numeric value
    
         $("#copytextfield"+theNum).val($("#textfield"+theNum).val());
    
         if( theNum === 4) {
            //$("#copytextfield"+theNum).val($("#select1").val());
        }
});