JSFiddle - React, Tailwind, and code Playground

HTML

<div id="block1">
   <input type="text" class="class1" value="a">
   <input type="text" class="class2" value="b">
   <input type="checkbox" class="class3"> checkbox
   <select class="class4">
       <option value="0">White</option>
       <option value="1">Brown</option>
       <option value="2">Gray</option>
   </select>
</div> 
and

<div id="block2">
   <input type="text" class="class1" value="a">
   <input type="text" class="class2" value="b">
   <input type="checkbox" class="class3"> checkbox
   <select class="class4">
       <option value="0">White</option>
       <option value="1">Brown</option>
       <option value="2">Gray</option>
   </select>
</div>

JavaScript

$('#block1 :input').change(function () {
    var $this = $(this);
    var $otherInput = $('#block1').not($this.closest('#block1')).find('.' + this.className);
    var isCheckable = $this.is(':radio,:checkbox');
    if (isCheckable) {
        $otherInput.prop('checked', this.checked);
    } else {    
        $otherInput.val($this.val());
    }
})