Load external javascript through script tag

Question

I am trying load a script dynamically using script tag. But I am not able to do it.

my render method is as below

render() {
<div> 
     <script type="text/javascript" language="javascript" src="//verify.authorize.net/anetseal/seal.js" ></script> 
     <a href="http://www.authorize.net/" id="AuthorizeNetText" target="_blank">Working. Yipee</a> 
</div>
}

I tried to use dangerouslySetInnerHtml but that is also not working.

I require this because, the script that is mentioned uses document.writeln. So I want it to display in this current div. I have no control over the script. It come from a third party.

Answer 1

I believe you could be more specific on what should be done once the script has been loaded. Something like this should suit you well:

componentDidMount() {
    var aScript = document.createElement('script');
    aScript.type = 'text/javascript';
    aScript.src = " /*URL Goes Here*/ ";

    document.head.appendChild(aScript);
    aScript.onload = function() {
        document.getElementById(" /*DIV ID HERE*/ ").InnerHTML = /*YOUR CODE*/;
    };
}