JSFiddle - React, Tailwind, and code Playground

by Ahmad Baktash Hayeri

HTML

<button id="btn">
  Click
</button>

<div class="block">
  
</div>

CSS

.block{
  height: 200px;
  border: 2px solid red;
}

JavaScript

var btn = document.getElementById('btn'),
block = document.querySelector('.block');

var attachFlag = false;

btn.onclick = function () {
	attachFlag = !attachFlag;
  if(attachFlag) {
  	block.innerHTML = "Handler Attached";
  	block.addEventListener('click', clickHandler);
  } else {
  	block.innerHTML = "Handler Detached";
    block.style.backgroundColor = "lightgray";
  	block.removeEventListener('click', clickHandler);
  }
}

function clickHandler () {
	this.style.backgroundColor = "lightCoral";
}