Question: CusineList print 0 on every click.Cant get the value in my li tag.

I have tried passing cussine to my updateMenu but output is not correct .when i click All it prints Arabian.

**Here is my code**

```
class Menu extends Component {
  state={
    cusineList: "All"
  }
  updateMenu = (e) => {
    this.setState( {cusineList: e.target.value} );
    console.log(this.state.cusineList);  
  }
    render() {
      const cusineArray = ["All",
         "Arabian",
         "Continental", 
         "Italian", 
         "Indian"];
      let cusines = (
        <ul className="cusine-list">
        { cusineArray.map(cusine =>
             li key={cusine} onClick={(e)=>this.updateMenu(e)}>
                   {cusine}
             </li>
        )}
      </ul>
      );
        return (
         <div>{cusine}</div>
    }
}
export default Menu;

```

I want to update state according to item clicked

Answer: 
`<li/>` tag does not have value property. Update your code with 

```
  updateMenu = (e) => {
    this.setState( {cusineList: e.target.innerHTML}, () => {
      console.log(this.state.cusineList)
    });
  }

```

Here's [slackblitz](https://stackblitz.com/edit/react-wjzmuj). innerHTML will get all the html + text inside `<li>` tag. Alternatively just to get text in this case you can also use `textContent` as suggested by @Kejt
See if that is what you're looking for:

```js
class Menu extends React.Component {
  constructor(props) {
    super(props);
    this.state={
      cusineList: "All"
    };
  }

  updateMenu = (selectedCusine) => {
    console.log(selectedCusine + ' has been selected!');  
    this.setState( {cusineList: selectedCusine} );
  };

  render() {

    const cusineArray = ["All",
      "Arabian",
      "Continental", 
      "Italian", 
      "Indian"
    ];

    const cusineItems = cusineArray.map(cusine =>
      <li key={cusine} className='cusineItem' onClick={()=>this.updateMenu(cusine)}>
        {cusine}
      </li>
    );

    return (
      <div>
        <ul className="cusine-list">
          {cusineItems}
        </ul>
        <div>Selected cusine is: {this.state.cusineList}</div>
      </div>
    );
  }
}

ReactDOM.render(<Menu/>, document.getElementById('root'));
```

```css
.cusineItem {
  cursor: pointer;
}
```

```html
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="root"/>
```