JSFiddle - React, Tailwind, and code Playground

HTML

<h1>
Cats and Dogs (and Objects)
</h1>

CSS

.Dog,
.Cat,
.mammal {
  font-size: 24px;
}

.Dog:after {
  content: "🐶";
}

.Cat:after {
  content: "🐱";
}

JavaScript

// write a constructor for dog
// using the Javascript 2016 class syntax
class dog{
	constructor(name, breed, age){
  	this.name = name;
  	this.breed = breed;
    this.age = age;
  }
  
  function render( o ){
  	$('body').append($('<span>').addClass('dog').text(o.name)); 
	}
}

// write a method for dog that is simliar to 'render' below
// setting the class to dog, not mammal


// write a constructor for cat
// using the classical syntax 
function cat(name, breed, age){
		this.name = name;
  	this.breed = breed;
    this.age = age;
}

// write a method for cat that is similar to 'render' below
// setting the css class to cat, not mammal

cat.prototype.render = function(0({
  	$('body').append($('<span>').addClass('dog').text(o.name)); 
	}


// write 
function render( o ){
  $('body').append($('<span>').addClass('mammal').text(o.name)); 
}

new Dog('Bello').render();
new Dog('Lorenz').render();
new Cat('Finn').render();