Как присвоить класс вложенным элементам массива?

У меня есть JSON, который я сохранил внутри переменной с именем фотографыInfo, и я получаю оттуда данные, но я хочу сделать следующее: я хочу показать теги, соответствующие каждому фотографу, с рамкой, данной каждому из них! как на этом фото Результат - Фото

Я использую литерал шаблона для отображения информации в HTML, на данный момент я использую метод join() для преобразования элемента в строку, но как я могу указать границу для каждого TAG?

Это мой код:

photographersInfo.forEach((item) => { 

  const photographersDiv = document.getElementById('container');
  const div = document.createElement("div");
  photographersDiv.appendChild(div);

  div.innerHTML = `
    <div class = "photographerContainer">
        <div class = "portraitBox">
          <img src = "${item.portrait}" alt = "photo">
        </div>
        <h1 class = "name">${item.name}</h1>
        <p class = "city">${item.city}, ${item.country}</p>
        <p class = "tagline">${item.tagline}</p>
        <p class = "price">${item.price}€/jour</p>
        <p class = "tags">${item.tags.join(" ")}</p>  
    </div>
    `   
});

Это мои данные JSON:

let photographersInfo = [
      {
        "name": "Mimi Keel",
        "id": 243,
        "city": "London",
        "country": "UK",
        "tags": ["#portrait", "#events", "#travel", "#animals"],
        "tagline": "Voir le beau dans le quotidien",
        "price": 400,
        "portrait": "/Photos/Portrait/MimiKeel.jpg"
      },
      {
        "name": "Ellie-Rose Wilkens",
        "id": 930,
        "city": "Paris",
        "country": "France",
        "tags": ["#sports", "#architecture"],
        "tagline": "Capturer des compositions complexes",
        "price": 250,
        "portrait": "/Photos/Portrait/EllieRoseWilkens.jpg"
      },
      {
        "name": "Tracy Galindo",
        "id": 82,
        "city": "Montreal",
        "country": "Canada",
        "tags": ["#art", "#fashion", "#events"],
        "tagline": "Photographe freelance",
        "price": 500,
        "portrait": "/Photos/Portrait/TracyGalindo.jpg"
      },
      {
        "name": "Nabeel Bradford",
        "id": 527,
        "city": "Mexico City",
        "country": "Mexico",
        "tags": ["#travel", "#portrait"],
        "tagline": "Toujours aller de l'avant",
        "price": 350,
        "portrait": "/Photos/Portrait/NabeelBrandford.jpg"
      },
      {
        "name": "Rhode Dubois",
        "id": 925,
        "city": "Barcelona",
        "country": "Spain",
        "tags": ["#sport", "#fashion", "#events", "#animals"],
        "tagline": "Je crée des souvenirs",
        "price": 275,
        "portrait": "/Photos/Portrait/RhodeDubois.jpg"
      },
      {
        "name": "Marcel Nikolic",
        "id": 195,
        "city": "Berlin",
        "country": "Germany",
        "tags": ["#travel", "#architecture"],
        "tagline": "Toujours à la recherche de LA photo",
        "price": 300,
        "portrait": "/Photos/Portrait/MarcelNikolic.jpg"
      }
    ]