quilljs formatting doesn’t work after loaded on page

I’m having an issue where after quilljs html code has been loaded from database works as regular paragraph.

This is how example in database looks:

This is how it looks on page where I’m creating that database item:

and this is how it looks on the result page (where users are supposed to look at it essentially)

Basically it does display text, but it doesn’t show it as h1 (even tho if I check source it does say )

This is my product.ejs code where it’s taking description from database and displaying it:

<%- include("partials/header") %>

<link href="https://cdn.quilljs.com/1.3.6/quill.snow.css" rel="stylesheet">

<div class="container mx-auto p-6">

  <div class="flex flex-col md:flex-row md:space-x-6 p-2 pb-4">
    <div>
      <h1 class="text-3xl font-semibold text-white"><%= product.name %></h1>
      <p class="text-gray-100 mt-2"><%= product.summary %></p>
    </div>
    <div>
    
    </div>
  </div>


  <div class="flex flex-col md:flex-row md:space-x-6">
    <!-- Product Image -->
    <div class="relative md:w-4/5 bg-gray-900 p-2 rounded-lg">
      <img id="main-image" class="w-full h-[60vh] object-cover rounded-lg shadow-md" src="/uploads/<%= product.mainImage %>" alt="<%= product.name %>">
      <button id="prev-arrow" class="invisible md:visible absolute left-4 w-10 h-10 bg-[#24242462] top-1/2 transform -translate-y-1/2  text-white p-2 rounded-full"><</button>
      <button id="next-arrow" class="invisible md:visible absolute right-4 w-10 h-10 top-1/2 transform -translate-y-1/2 bg-[#24242462] text-white p-2 rounded-full">></button>
      <div class="flex mt-4 space-x-2">
        <img class="image w-[10vh] h-[10vh] object-cover rounded-lg shadow-md cursor-pointer" src="/uploads/<%= product.mainImage %>" alt="<%= product.name %>">
    
        <% product.images.forEach(function(image) { %>
          <img class="image w-[10vh] h-[10vh] object-cover rounded-lg shadow-md cursor-pointer" src="/uploads/<%= image %>" alt="<%= product.name %>">
        <% }); %>
      </div>
    </div>
    <!-- Product Sidebar -->
    <div class="md:w-1/5 mt-6 md:mt-0 flex flex-col justify-between bg-gray-900 rounded-lg p-4">
      <div class="h-full">

        <h1 class="text-1xl font-semibold text-white">Purchase a license</h1>
        <p class="text-xl text-indigo-600 font-bold mt-2">$<%= product.price %></p>
        <hr class="w-full border-b-1 border-gray-700 mt-4">
        <p class="text-gray-100 mt-4">Features:</p>
          <% product.features.forEach(function(feature) { %>
            <p><span class="text-green-500">✓</span><span class="ml-4"><%= feature %></span></p>
          <% }); %>

      </div>
      <div>
        <hr class="w-full border-b-1 border-gray-700 mt-4">

        <button class="w-full mt-6 px-4 py-2 bg-indigo-600 text-white font-semibold rounded-lg shadow-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2">Purchase</button>
      </div>
    </div>
  </div>
  <div class="grid bg-gray-900 p-4 mt-4 rounded-lg" id="description">
    <h1 class="text-2xl font-semibold text-white mt-2">Description</h1>
    <div class="description-content">
      <%- product.description %>

    </div>
  </div>

</div>

<script>
  const images = document.querySelectorAll('.image');
  const mainImage = document.getElementById('main-image');
  const prevArrow = document.getElementById('prev-arrow');
  const nextArrow = document.getElementById('next-arrow');

  let currentIndex = 0;

  const updateMainImage = (index) => {
    mainImage.src = images[index].src;
  };

  images.forEach((image, index) => {
    image.addEventListener('click', () => {
      currentIndex = index;
      updateMainImage(currentIndex);
    });
  });

  prevArrow.addEventListener('click', () => {
    currentIndex = (currentIndex > 0) ? currentIndex - 1 : images.length - 1;
    updateMainImage(currentIndex);
  });

  nextArrow.addEventListener('click', () => {
    currentIndex = (currentIndex < images.length - 1) ? currentIndex + 1 : 0;
    updateMainImage(currentIndex);
  });
</script>
<script src="https://cdn.quilljs.com/1.3.6/quill.js"></script>



<%- include("partials/footer") %>