const filterThroughItems = ((_siteNavItems) => { let siteNavItems = _siteNavItems; var n = _siteNavItems[0].links.length; const x = 0, y = 20; for (var i = 0; i < n; i++) { var cut = _siteNavItems[0].links[i].name; var sizeOfString = _siteNavItems[0].links[i].name.length; if (sizeOfString > 20) { cut = cut.slice(x, y) + '<br/>' + cut.slice(y); _siteNavItems[0].links[i].name = cut; } } siteNavItems = _siteNavItems; return siteNavItems; })

así que básicamente filtro a través de la barra de navegación y corto la cadena después de los primeros 20 caracteres y quiero ingresar un html <br/> (también probé \n y \r\n) entre ellos, por lo que divide el texto en dos líneas.

 <div name="A.01. Test string as<br/>ów test test test" class="ms-Nav-compositeLink is-expanded is-selected compositeLink-177"> <button class="ms-Nav-chevronButton chevronButton-195" aria-label="A.01. Test string as<br/>ów test test test" aria-expanded="true" tabindex="0"><i data-icon-name="ChevronDown" role="presentation" aria-hidden="true" class="ms-Nav-chevron chevronIcon-215"></i></button> <a class="ms-Button ms-Button--action ms-Button--command ms-Nav-link link-210" href="/sites/WIN/SitePages/A1Test.aspx" title="A.01. Test string as<br/>ów test test test" data-is-focusable="true"> <div class="ms-Button-flexContainer flexContainer-200"> <div class="ms-Nav-linkText linkText-176">A.01. Test string as&lt;br/&gt;ów test test test</div></div></a></div>

Traté de trabajar también con el DOM, pero el ClassName actual cambia de linkText-176 de forma incremental.

Mi problema es que SÍ inserta el br, pero como una cadena simple y no como HTML real. ¿Alguna idea de cómo puedo lograr eso?