title: How to change style of a character based on a condition
body: <p>I want to give the color red to each 'e' letter in the text. I think I just need to wrap them in a span where the condition is met but couldn't figure it out. The below code is how far I came so far.</p>
  
  <p>Here's the non-working code and the output is <code>h[object Object]llo</code></p>
  
  <pre><code>import React from "react";
  import ReactDOM from "react-dom";
  
  function App() {
    const str = "hello";
    const myArr = str.split("");
    let output = "";
  
    for (let i = 0; i &lt; myArr.length; i++) {
      if (myArr[i] === "e") {
        output += &lt;span style={{color:'red'}}&gt;myArr[i]&lt;/span&gt;;
      } else {
        output += myArr[i];
      }
    }
    return output;
  }
  
  ReactDOM.render(&lt;App /&gt;, document.getElementById("root"));
  </code></pre>