Outputting raw HTML stored in an object in React

Problem – I see raw HTML code outputted as a string. Currently th data is stored in an object

Data

const data = [
  {
   title: "Hello"
   body: "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean est mauris, tempor at aliquam vitae, mattis iaculis ex. Donec suscipit enim non nisi maximus, vel tincidunt ex accumsan</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean est mauris, tempor at aliquam vitae, mattis iaculis ex. Donec suscipit enim non nisi maximus, vel tincidunt ex accumsan</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean est mauris, tempor at aliquam vitae, mattis iaculis ex. Donec suscipit enim non nisi maximus, vel tincidunt ex accumsan</p>"
   }
]

Child component

<div>
<h3>{props.title}</h3>
{props.body}
</div>

Heres what gets outputted in browser (includes <p>)

Hello

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean est mauris, tempor at aliquam vitae, mattis iaculis ex. Donec suscipit enim non nisi maximus, vel tincidunt ex accumsan</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean est mauris, tempor at aliquam vitae, mattis iaculis ex. Donec suscipit enim non nisi maximus, vel tincidunt ex accumsan</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean est mauris, tempor at aliquam vitae, mattis iaculis ex. Donec suscipit enim non nisi maximus, vel tincidunt ex accumsan</p>

How can I render the content so that the

is interpreted as a html element in the browser and not a string?