Как при поиске изменить цвет у части слова?

.highlighted {
  color: red;
  font-weight: bold;
  font-size: 1.5em;
}

class App extends React.Component {
  state = {
    items: [ 'aaa', 'aa1', 'ab1', 'zzz', '00!', 'lorem ipsum dolor...' ],
    search: '',
  }

  render() {
    const { items, search } = this.state;
    const regex = RegExp(search, 'g');
    const replacement = '<span class="highlighted">$&</span>';

    return (
      <div>
        <input value={search} onChange={e => this.setState({ search: e.target.value })} />
        {search &&
        <ul>
          {items.filter(n => n.includes(search)).map(n =>
            <li dangerouslySetInnerHTML={{ __html: n.replace(regex, replacement) }} />
          )}
        </ul>}
      </div>
    );
  }
}