I am stuck a bit with replacing strings in the HTML file through looping on the array. I am reading the HTML file it's a big template file attached to the email. I want to loop on data and replace HTML with dynamic data. But only one element is replacing.

<table cellpadding="10" cellspacing="0" width="600" align="center"
                                        style="border-collapse:collapse;background:white;">
                                        <tr>
                                            <td>
                                                <table cellpadding="0" cellspacing="0" width="600" align="left" border="1" id="myTable">
                                                    <tr>
                                                        <td>Date</td>
                                                        <td>%DateTo% - %DateFrom%</td>
                                                    </tr>
                                                    <tr>
                                                        <td>Url</td>
                                                        <td>%reportUrl%</td>
                                                    </tr>
                                                </table>
                                            </td>
                                        </tr>
</table>


 let mailHtml = '';
  mailHtml = fs.readFileSync('app/emailTemplates/ReportTemplate .html').toString();
 dataValues.forEach(ele => {
                            mailHtml = mailHtml.replace('%DateTo%', ele.dateTo);
                            mailHtml = mailHtml.replace('%DateFrom%', ele.dateFrom);
                            mailHtml = mailHtml.replace('%reportUrl%', ele.reportUrl);
            
})