sample: select table row and get td texts

by sii_side

HTML

<table id="tbl">
  <tr><td>1</td><td>2</td><td>3</td></tr>
  <tr><td>4</td><td>5</td><td>6</td></tr>
  <tr><td>7</td><td>8</td><td>9</td></tr>
</table>

<input id="op">

CSS

table, td {
  border: 1px solid;
}

.selected {
  background-color: #fdd;
}

JavaScript

var table = document.querySelector("#tbl");
table.addEventListener("click", function(e) {
	var trs = table.querySelectorAll("tr");
	for(var i = 0; i < trs.length; i++) {
  	trs[i].className = "";
   }

	var op = document.querySelector("#op");
  op.value = "";

	if(e.target.tagName.toLowerCase() === "td") {
		var tr = e.target.parentNode;
		var tds = tr.querySelectorAll("td");

		tr.className = "selected";
    for(i = 0; i < tds.length; i++) {
    	op.value += tds[i].textContent;
    }
  }
}, false);