Foreach Char in String in nextjs not working

I tried to loop each character in String but SPANS are not rendering. What am I doing wrong?

export default function Work() {
  const logoText =
    "The future starts here.";

  return (
    <div className="absolute w-full h-full">
        {logoText
           .split("")
           .forEach(
             (character, i) =>
               `<span className="rotate-[${
                 i * 8.1
               }deg] absolute left-[50%] text-xl origin-[0px_130px]">${character}</span>`
         )}
    </div>

I also tried with putting only "character" instead of all the span code and it doesnt’ work.

>Solution :

change forEach to map for geting return

try this it work fine:

export default function Work() {
  const logoText =
    "The future starts here.";

  return (
    <div className="absolute w-full h-full">
      {logoText.split('').map((character, i) => (
          <span
            className="rotate-[${
                i * 8.1
              }deg] absolute left-[50%] text-xl origin-[0px_130px]"
          >
            {character}
          </span>
        ))}
    </div>

also you can check live code here: https://stackblitz.com/edit/react-wnwgkt?file=src%2FApp.js