title: Get the value of a table cell in javascript with external script
body: <p>I have a simple table filled with rows from a MySQL database, the HTML part looks like this</p>
  
  <pre><code>  &lt;tbody&gt;
      &lt;?php while($row = mysqli_fetch_row($result)){ ?&gt;
      &lt;tr class="rows" id="&lt;?php echo $row[0]; ?&gt;"&gt;  // the id is an auto incremented int
        &lt;td id="col1"&gt;&lt;?php echo $row[1]; ?&gt;&lt;/td&gt;
        &lt;td id="col2"&gt;&lt;?php echo $row[2]; ?&gt;&lt;/td&gt;
        &lt;td id="col3"&gt;&lt;?php echo $row[3]; ?&gt;&lt;/td&gt;
        &lt;td id="col4"&gt;&lt;?php echo $row[4]; ?&gt;&lt;/td&gt;
        &lt;td id="col5"&gt;&lt;?php echo $row[5]; ?&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;?php } ?&gt;
    &lt;/tbody&gt;
  </code></pre>
  
  <p>It gets the job done and I have a nice table. Now I want that if I click on a row, i get five variables with the values of the cells. </p>
  
  <p>The problem what stopped me was to get the <code>&lt;td&gt;</code> element. This is what I tried in the external javascript file:</p>
  
  <pre><code>var rows    = document.getElementsByClassName('rows');
  for (var i=0; i&lt;rows.length; i++){
      rows[i].onclick = function(){
          console.log(this.getElementById('col1')); // I tried to print it first
      }
  }
  </code></pre>
  
  <p>The console responded this: <code>Uncaught TypeError: undefined is not a function</code>.</p>
  
  <p>Then I tried <code>console.log(rows[i].getElementById(vonalkod));</code>, but it responded <code>Uncaught TypeError: Cannot read property 'getElementById' of undefined</code></p>
  
  <p>If I only write <code>console.log(this);</code> then it prints what I expect, the whole row in html. </p>
  
  <p>So my question is that what is the syntax to get those cells by ID? </p>