title: Make <br /> from string works in react
body: <p>Here are some ajax calls returns <code>&lt;br /&gt;</code> in their data, while I found it was hard to handle.</p>
  
  <p>Here is what I got for now, but not working at all. The string was split correctly, while react gave me several <code>&lt;span&gt;&lt;/span&gt;</code> tags without proper <code>&lt;br /&gt;</code> line breaks.</p>
  
  <pre class="lang-js prettyprint-override"><code>const breakLine = text =&gt; {
      const regex = /&lt;br\s*[\/]?&gt;/gi
  
      return text.split(regex).map(
          line =&gt; line.match(regex) ? React.createElement('br') : line
      )
  }
  
  const Text = ({ content }) =&gt; &lt;p&gt;
      { breakLine(content) }
  &lt;p&gt;
  
  // Usage
  &lt;Text content="Here are some &lt;br /&gt; Lines &lt;br&gt; to break!" /&gt;
  </code></pre>