<!DOCTYPE html>
<html>
<head>
<style>
table, th {
    border: 1px solid black;
}

</style>
</head>
<body>

<p>Click on each th element to alert its index position in the table row.</p>

<table>
  <tr>
    <th onclick="myFunction(this)">Click to show cellIndex</th>
    <th onclick="myFunction(this)">Click to show cellIndex</th>
    <th onclick="myFunction(this)">Click to show cellIndex</th>
    <th onclick="myFunction(this)">Click to show cellIndex</th>
  </tr>
</table>

<script>
function myFunction(x) {
    alert("Cell index is: " + x.cellIndex);
}
</script>

</body>
</html>