JSFiddle - React, Tailwind, and code Playground

HTML

<div id="div1">Img1:
    <img id="img1" src="http://s.imgur.com/images/imgurlogo-header.png" onclick="yourFunction();" />
</div>
<div id="div2">txt1:
    <input type="text" id="txt1" />
</div>
<input type="button" value="Disable It" onclick="disableit();" />
<input type="button" value="Enable It" onclick="enableit();" />

CSS

img {
    background-color:#000;
}

JavaScript

function right(e) {
    if (navigator.appName == 'Netscape' && e.which == 1) {
        return false;
    }
    if (navigator.appName == 'Microsoft Internet Explorer' && event.button == 1) {
        return false;
    } else return true;
}


function disableit() {
    document.getElementById('txt1').disabled = true;
    document.getElementById("div1").disabled = true;
    document.getElementById("div2").disabled = true;
    document.getElementById("img1").onmouseup = right;
    document.getElementById("img1").onmousedown = right;
    document.getElementById("img1").onclick = right;
}

function enableit() {
    document.getElementById('txt1').disabled = false;
    document.getElementById("div1").disabled = false;
    document.getElementById("div2").disabled = false;
    document.getElementById("img1").onmouseup = null;
    document.getElementById("img1").onmousedown = null;
    document.getElementById("img1").onclick = yourFunction;
}

function yourFunction() {
    alert('Clicked Div1');
}