JSFiddle - React, Tailwind, and code Playground

HTML

<table id="tabelle">
  <thead>
    <tr>
      <th>Name</th>
      <th>Rasse</th>
    </tr>
  </thead>
  <tbody></tbody>
</table>

CSS

table td {
  padding: 5px 20px;
  text-align: left;
}

JavaScript

var $table = document.getElementById("tabelle").getElementsByTagName('tbody')[0];

var addTableRow = function(animal) {
  console.log(animal.name + ':', animal);
  var newrow = document.createElement('tr');
  newrow.innerHTML = '<td>' + animal.name + '</td><td>' + animal.rasse + '</td>';
  $table.appendChild(newrow);
}


/********** KATZEN **********/

var Katze = function (name) {
  this.name = name || '?';
}
Katze.prototype.rasse = "Europäisch Kurzhaar";
Katze.prototype.setRasse = function (rasse) {
  this.rasse = rasse;
}

// Katze Maunzi
var maunzi = new Katze('Maunzi');
addTableRow(maunzi);
// Katze Maunzi neu
Katze.prototype.setRasse = function (rasse) {
  this.rasse = 'neu: ' + rasse;
}
maunzi.setRasse('Hauskatze');
addTableRow(maunzi);


/********** HUNDE **********/

var Hund = function (name) {
  this.name = name || '?';
  this.rasse = "Schäferhund";
  this.setRasse = function (rasse) {
    this.rasse = rasse;
  }
}

// Hund Bello
var bello = new Hund('Bello');
addTableRow(bello);
// Hund Bello neu
Hund.setRasse = function (rasse) {
  this.rasse = 'neu: ' + rasse;
}
bello.setRasse('Mischling');
addTableRow(bello);