React js Bold Specfic Text In a String

    const makeBold = (item, keywords) => {

      let result = item;

      keywords.forEach(keyword => {

        const re = new RegExp(keyword, 'g');

        result = result.replace(re, `<span>${keyword}</span>`);

      });

      return result;

    };

​

    function App() {

      const items = ['Font Awesome Icons', 'Sarkari Naukri Exams', 'Tutorials Plane'];

      const boldKeywords = ['Awesome', 'Naukri'];

​

      return (

        <div className="container text-bold">

          <h3>React Js Bold Specfic Text In A String</h3>

          <ul>

            {items.map((item, index) => (

              <li key={index} dangerouslySetInnerHTML={{ __html: makeBold(item, boldKeywords) }}

              />

            ))}

          </ul>

        </div>

      );

    }

​

    ReactDOM.render(<App />, document.getElementById('app'));

  </script>