I have an odd case that I need to solve. I have a react app that dynamically injects html content via (dangerouslySetInnerHTML={{__html: data}}). Think of it as a pseudo content management system with some legacy html content with some embedded javascript method calls, so I can't change the follling html block.

Example embedded html block (injected using dangerouslySetInnerHTML):

<p><a href="javascript:showvideo('http://urldir/vid.mp4',vwidth,vheight,0)">Launch vid.</a></p>

in my react component:

function showvideo(url,width,height,id){
  console.log('called showvideo')
}

I keep getting 'Uncaught ReferenceError: showvideo is not defined'

How do I call a function with <a href='javascript:myfunction'> in react?