CODEWITHSUNDEEP
javascripthtml
user552231
user552231

Reputation: 1135

Change table data on click - javascript

I am a beginner in JavaScript. I am trying to program that present a table, and upon clicking on a cell it changes its content. this is what I tried to do: 

<!DOCTYPE html>
<html>

<head>
  <style>
    table,
    td {
      border: 3px solid black;
    }
  </style>
</head>

<body>

  <table id="myTable">
    <tr>
      <td onclick="this.value ='Change 1';">cell 1</td>
      <td onclick="this.value ='Change 2';">cell 2</td>
    </tr>

  </table>

</body>

</html>

Upvotes: 1

Views: 1474

Answers (1)

Pranav C Balan
Pranav C Balan

Reputation: 115282

td doesn't have value property, you need to use innerHTML or textContent instead

<!DOCTYPE html>
<html>

<head>
  <style>
    table,
    td {
      border: 3px solid black;
    }
  </style>
</head>

<body>

  <table id="myTable">
    <tr>
      <td onclick="this.innerHTML ='Change 1';">cell 1</td>
      <td onclick="this.innerHTML ='Change 2';">cell 2</td>
    </tr>
  </table>

</body>

</html>

Upvotes: 2

Related Questions