JavaScript append HTML in for-loop

Question

in the following snippet I have a for-loop and want to append the HTML Code in each Iteration to use the list inside my ul-Tag. If I replace the += with the = operator it works, but only for the last element obviously. How can I append it correctly in the loop?

    var text = "the Text"
    var list
    for (var i = 1; i < split_respone.length; i+=2) {
      list += <li className="link-list-item">
            <a
            href={split_respone[i]}
            target="_blank"
            rel="noopener noreferrer"
            className="link-list-item-url">
            {split_respone[i+1]}</a>
            </li>
    }
    string = <ul className="link-list">{text}{list}</ul>;
  } 
  const message = self.createChatBotMessage(string);
});
}

Answer 1

You have to set "list" to an empty string for it to work. Additionally, because you are combining strings, you need to enclose the HTML with quotes. (You can also use ``)

    var text = "the Text"
    var list = "";
    for (var i = 1; i < split_respone.length; i+=2) {
      list += '<li className="link-list-item">
            <a
            href={split_respone[i]}
            target="_blank"
            rel="noopener noreferrer"
            className="link-list-item-url">
            {split_respone[i+1]}</a>
            </li>'
    }
    string = <ul className="link-list">{text}{list}</ul>;
  } 
  const message = self.createChatBotMessage(string);
});