JSFiddle - React, Tailwind, and code Playground

by Guruprasad Rao

CSS

.backChange{
    background:red;
}

JavaScript

function highlight(ctrl){
   var elements=document.getElementsByTagName('tr');
    for(var i=0;i<elements.length;i++)
        elements[i].classList.remove('backChange');
   var parent=ctrl.parentNode.parentNode;
   parent.classList.add("backChange");
}

document.write("<table id=appTable border=1 style=margin-top:10px; margin-left:10px;>")
        document.write("<tr><th>Select</th><th>Name</th><th>Location</th><th>Action</th></tr>");
for (row=1; row<5; row++) {
                     document.write("<tr class='New'>")
                     for (col=1; col<=4; col++) {
                            if(col==1)
                {                       document.write("<td><input type='checkbox' id='mapCheck' name='myTextEditBox' /></td>")
                }

                            if(col==2)
                                 document.write("<td width='140'>Name</td>")
                            if(col==3)
                                 document.write("<td width='200'>Location</td>")
                if(col==4)
                 document.write("<td><button type='button' onclick='highlight(this)'>select</button></td>")
                        }
                document.write("</tr>")
                }
        document.write("</table>")