Clean code for adding elements in vanilla JS

Question

I have an array of objects that also contains arrays and I want to render some elements out of it, just in vanilla JS.

const companyShops = [
  {
    shop: "Somewhere",
    address: {street: "Street 85", zipcode: "0000EH", place: "Somewhere"},
    hours: [
      {day: "maandag", open: "12.00", closed: "18.00"},
      {day: "dinsdag", open: "10.00", closed: "18.00"},
      {day: "woensdag", open: "10.00", closed: "18.00"},
      {day: "donderdag", open: "10.00", closed: "21.00"},
      {day: "vrijdag", open: "10.00", closed: "18.00"},
      {day: "zaterdag", open: "10.00", closed: "18.00"},
      {day: "zondag", open: "gesloten"}
    ]
  },
  {
    shop: "Else",
    address: {street: "Street 50", zipcode: "0000PC", place: "Else"},
    hours: [
      {day: "maandag", open: "gesloten"},
      {day: "dinsdag", open: "10.00", closed: "18.00"},
      {day: "woensdag", open: "10.00", closed: "18.00"},
      {day: "donderdag", open: "10.00", closed: "21.00"},
      {day: "vrijdag", open: "10.00", closed: "18.00"},
      {day: "zaterdag", open: "10.00", closed: "17.00"},
      {day: "zondag", open: "gesloten"}
    ]
  }
]

The code I currently have works, but I don't like the looks of it.

HTML:

<div class=shops"></div>

JS:

const storeHours = times => {
    return `
        ${times.map(time => 
             `
             <p class="hours"><b>${time.day}</b> ${time.closed 
                 ? `<span>${time.open} - ${time.closed}</span>` 
                 : `<span>${time.open}</span>`
             }</p>
             `
        )
        .join("")
    }
    `;
};

const shopInfo = companyShops.map(shop => {
        const { place } = shop.address;
        const { hours } = shop;
        return `
            <div class="shop-container">
                <div class="${place.toLowerCase()}-bg-container">
                    <a href="#">Afspraak ${place} maken</a>
                </div>
                <div class="store-hours">${storeHours(hours)}</div>
            </div>
        `;
    })
.join("");

const shops = document.querySelector(".shops");

shops.innerHTML = shopInfo;

Especially the storeHours function looks hideous with all those nesting backticks.

For the storeHours I've tried this, but that doesn't work, I get undefined:

const storeHours = (times) => {
    times.map(time => {
        return `
        <p class="hours"><b>${time.day}</b> ${time.closed 
            ? `<span>${time.open} - ${time.closed}</span>` 
            : `<span>${time.open}</span>`
            }</p>
        `
    })
    .join("")

};

Long story short, is there a way to make it look better, I'd like it to look more similar to "shopInfo".