JSFiddle - React, Tailwind, and code Playground

by hellosze

HTML

<table id="t">   
   <tr><td id="t1">one</td></tr>   
   <tr><td id="t2">two</td></tr>   
</table>

<input type="text" id="f1" />
<input type="text" id="f2" />

CSS

#t { border: 1px solid red }  
#t1 { background-color: pink; }

JavaScript

// Function to change the content of t2  
function modifyText() {  
 var t2 = document.getElementById("t2");  
 t2.firstChild.nodeValue = "three";      
}  

function hello(){
 alert("Hello");   
}

function copy(){
 document.getElementById("f1").value = document.getElementById("f2").value;   
    
}
// add event listener to t  
var el = document.getElementById("t");   
el.addEventListener("click", modifyText, false);   

var f1 = document.getElementById("f1");
var f2 = document.getElementById("f2");

//window.addEventListener("onkeydown",hello,false);
window.addEventListener("keyup",copy,false);