title: Creating a button in react that, when clicked, opens a webpage
body: <p>Clicking the button does nothing.</p>
  
  <p>I've tried passing in the <code>&lt;a href={news.url}&gt;</code> into the function I use to generate the button. Currently the code shows the link on the button but I'm stumped at how to open a new tab with the provided Url. I've heard a lot of people talking about Router, but it seems to me why do I have to use this for such a simple thing. As usual I overthink these things. 
  The data is brought in from an object on another file.</p>
  
  <pre><code>import React from 'react';
  import PropTypes from 'prop-types';
  import './index.css';
  import FileName from './filename';
  import Subtitle from './subtitle';
  
  const ListItem  = ({news}) =&gt; ( 
  
      &lt;tr className="list-item"&gt;
          &lt;td&gt;&lt;FileName news={news} /&gt; &lt;a href={news.url}&gt;{news.url}&lt;/a&gt;&lt;/td&gt;
          &lt;HandleClick openUrl={news.url} passLink={&lt;a href={news.url}&gt;{news.url}&lt;/a&gt;}/&gt;
          &lt;span className="website"&gt;&lt;/span&gt;
          &lt;td&gt;&lt;Subtitle news={news}/&gt; &lt;/td&gt;
      &lt;/tr&gt;
  )
  
   function HandleClick (props)  {
      return(
      &lt;button onClick={props.passLink}&gt;{props.openUrl} &lt;/button&gt;
      )
  }
  
  export default ListItem
  
  </code></pre>
  
  <p>I expect the button to open a new tab in the browser which uses the link I've provided with the props. The button does nothing.</p>