JSFiddle - React, Tailwind, and code Playground

HTML

<input id='textarea' type="text" style="width: 100px; height: 50px;" disabled>
<input id='checkbox' type="checkbox">
<button id='button' type="button">button</button>
<button id='bbutton' type="button">bbutton</button>

JavaScript

document.getElementById('checkbox').addEventListener('change', checkboxStateChanged);

document.getElementById('button').addEventListener('click', buttonClicked);
document.getElementById('bbutton').addEventListener('click', bbuttonClicked);

var textArea = document.getElementById('textarea')

function checkboxStateChanged(event){
	textArea.disabled = !event.target.checked
}

function buttonClicked(event){
	var checkbox = document.getElementById('checkbox')
  checkbox.click()
}

function bbuttonClicked(event){
	var checkbox = document.getElementById('checkbox');
  checkbox.checked = !checkbox.checked;
	var ev = document.createEvent("HTMLEvents");
  ev.initEvent('change', true, true);
  checkbox.dispatchEvent(ev);
}