This page demonstrates how to use JavaScript data attributes to differentiate data.
When you click Show Creature Home, the background color will change color based on their natural environment:
When you click Show Creature Type, the border color and style will changed based on the type of creature:
Monkeys are cute, but don't try to cuddle them.
Hummingbirds are cute, but don't get in the way of their food.
Spiders are not cute, in fact they creep me out.
Crows are not cute, and don't feed them your french fries.
Fish are not cute, but they taste good!
Stinkbugs are not cute! Don't touch them!