const varer = [
    { name:'smør', cat:'meieriprodukter'},
    { name: 'melk', cat:'meieriprodukter'},
    { name:'fløte', cat:'meieriprodukter'},
    { name:'leppestift', cat:'kosmetikk'},
    { name: 'eyeliner', cat: 'kosmetikk'}
]
const body = document.querySelector('body')
body.innerHTML = "<h1>Alle varer</h1>"
varer.map(
    vare => 
    body.innerHTML += `<li>${vare.name}</li>`
)

body.innerHTML += "<h2>Meieriprodukter</h2>"

const meieri = varer.filter(
    vare => 
    vare.cat === 'meieriprodukter'
)

meieri.map(
    vare => 
    body.innerHTML += `<li>${vare.name} (${vare.cat})</li>`
)
body.innerHTML += "<h2>Kosmetikk</h2>"
const kosmetikk = varer.filter(
    vare => 
    vare.cat === 'kosmetikk'
)

kosmetikk.map(
    vare => 
    body.innerHTML += `<li>${vare.name} (${vare.cat})</li>`
)