React DOM Elements: dangerouslySetInnerHTML

dangerouslySetInnerHTML — Is React’s replacement for using innerHTML in the browser DOM.

Setting HTML from code is risky because it’s easy to inadvertently expose your users to a cross-site scripting (XSS) attack, so, you can set HTML directly from React, but you have to type out dangerouslySetInnerHTML and pass an object with a __html key, to remind yourself that it’s dangerous.

function createMarkup() {
  return {__html: 'First · Second'};
}

function MyComponent() {
  return <div dangerouslySetInnerHTML={createMarkup()} />;
}