I'm trying to use the google schema FAQ in the JSON-LD format with nextJs for the seo of a blog.

It's working, I just have one concern.

For a response I have a list. And I need to go back at the lign. I tried using br tags , but it's showing in the html br and the answer as plain text.

How can I make so the br is taken as a tag

Below my code :

export default function Test() {

    let {t, lang} = useTranslationMe('blog')
    const router = useRouter();

    const schemaData = {
        "@context": "https://schema.org",
        "@type": "FAQPage",
        "mainEntity": [{
            "@type": "Question",
            "name": t('title-9'),
            "acceptedAnswer": {
                "@type": "Answer",
                "text": t('text-129')
            }
        }, {
            "@type": "Question",
            "name": t('title-10'),
            "acceptedAnswer": {
                "@type": "Answer",
                "text": `${t('text-130')}<br> ${t('text-131')}<br> ${t('text-131')} <br> ${t('text-132')} <br> ${t('text-133')}`
            }
        }, {
            "@type": "Question",
            "name": t('title-11'),
            "acceptedAnswer": {
                "@type": "Answer",
                "text": t('text-134')
            }
        }]
    }

    

return (
<>
 <script type="application/ld+json" >
     {JSON.stringify(schemaData)}
 </script>
 <div>
   <div className="schema-faq-section">
    {schemaData.mainEntity[0].name}
    <p>{schemaData.mainEntity[0].acceptedAnswer.text}</p>
   </div>
   <div className="schema-faq-section">
    {schemaData.mainEntity[1].name}
   <p>{schemaData.mainEntity[1].acceptedAnswer.text}</p>
   </div>
 </div>
</>
)

Thank you for your help and explanation.