title: Error in Component Output by Button Click
body: <p>I have 2 buttons and information about div. When I click on one of the buttons, one component should appear in the div info. Where is the error in the withdrawal of the component div info?</p>
  
  <pre><code>
  import React, { Component } from 'react';
  import Donald from '/.Donald';
  import John from '/.John';
  
  class Names extends Component {
    state = {
      array:[
        {id:1,component:&lt;Donald/&gt;, name:"Me name Donald"},
        {id:2,component:&lt;John/&gt;, name:"My name John"},
      ],
      currComponentId: null
  
  
     changeComponentName = (idComponent) =&gt; {
      this.setState({currComponentId:idComponent});
     };
  
     render() {
      return(
        &lt;table&gt;
          &lt;tbody&gt;
          &lt;tr className="content"&gt;
          {
           this.state.array.map(item=&gt; item.id===this.element.id).component
          }   
         &lt;/tr&gt;
            &lt;button className="Button"&gt;
              {
                this.state.array.map( (element) =&gt; {
                  return (
                    &lt;td key={element.id}
                      className={this.state.currComponentId === element.id ? 'one' : 'two'}
                      onClick={ () =&gt; this.changeComponentName(element.id)}
                      &gt;{element.name}
                    &lt;/td&gt;
                  )
                }) 
              }
            &lt;/button&gt;  
          &lt;/tbody&gt;
        &lt;/table&gt;
      )
    }
  }
  
  export default Names;
  </code></pre>