Luca,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style>
#app>ul li:nth-child(even){
color:cornflowerblue;
}
#app>ul li:nth-child(odd){
color:coral;
}
</style>
</head>
<body>
<div id="app"> </div>
<script>
"use strict";
let types = {
sBool : '<h3>boolean</h3><ul>',
sString : '<h3>string</h3><ul>',
sNumber : '<h3>number</h3><ul>',
sFunction : '<h3>function</h3><ul>',
sObject : '<h3>object</h3><ul>'
};
let s = "<ul>";
for (let i in app){
s += `<li>${i}</li>`;
//log(typeof app[i]);
switch (typeof app[i]) {
case 'boolean' : types.sBool += `<li>${i}</li>`;
case 'string' : types.sString += `<li>${i}</li>`;
case 'number' : types.sNumber += `<li>${i}</li>`;
case 'function' : types.sFunction += `<li>${i}</li>`;
case 'object' : types.sObject += `<li>${i}</li>`;
}
}
for (let i in types) {
types[i] += "</ul>";
app.innerHTML += types[i];
}
</script>
</body>
</html>