React: Script tag not working when inserted using dangerouslySetInnerHTML
<p>I'm trying to set html sent from my server to show inside a div using dangerouslySetInnerHTML property in React. I also have script tag inside it and use functions defined in same inside that html. I have made example of error in JSFiddle <a href="https://jsfiddle.net/ankit2313/9Lcctu03/" rel="noreferrer">here</a>.</p>

<p>This is test code:</p>

<pre><code>var x = '&lt;html&gt;&lt;scr'+'ipt&gt;alert("this.is.sparta");function pClicked() {console.log("p is clicked");}&lt;/scr'+'ipt&gt;&lt;body&gt;&lt;p onClick="pClicked()"&gt;Hello&lt;/p&gt;&lt;/body&gt;&lt;/html&gt;';

var Hello = React.createClass({
  displayName: 'Hello',
  render: function() {
    return (&lt;div dangerouslySetInnerHTML={{__html: x}} /&gt;);
  }
});
</code></pre>

<p>I checked and the script tag is added to DOM, but cannot call the functions defined within that script tag. If this is not the correct way is there any other way by which I can inject the script tag's content.</p>