title: Button's onClick not returning id
body: <p>I'm trying to read the <code>id</code> of a <code>&lt;Button /&gt;</code> component when it's clicked:</p>
  
  <pre><code>const FlagsDialog = (props) =&gt; {
    const {
      classes,
      handleClose,
      showFlagsDialog,
    } = props;
  
    const selectLang = (evt) =&gt; {
      console.log('CLICKED', evt.target.id);
    };
  
    return (
      &lt;Dialog
        open={showFlagsDialog}
        onClose={handleClose}
        aria-labelledby="alert-dialog-title"
        aria-describedby="alert-dialog-description"
      &gt;
        &lt;Button onClick={selectLang} id="en"&gt;English&lt;/Button&gt;
        &lt;Button onClick={selectLang} id="es"&gt;Spanish&lt;/Button&gt;
        &lt;Button onClick={selectLang} id="fr"&gt;French&lt;/Button&gt;
        &lt;Button onClick={selectLang} id="de"&gt;German&lt;/Button&gt;
      &lt;/Dialog&gt;
    );
  };
  </code></pre>
  
  <p>But when run, the click only returns the text <code>CLICKED</code>, and no value for the clicked button's <code>id</code>. What am I doing wrong?</p>