I have 4 divs that onClick call a function. When the particular div is clicked, I want the other divs to be non-clickable. But until the particular div is clicked, I want them to be clickable. My code:

```
import React, { Component } from 'react';

class MyApp extends Component {
    state = {
        div:2
    }

    handleClick = (id) => {
        id==this.state.div? 
        //disable onClick for all divs :
        //do nothing
    }

    render() {
      return (
        <div>
            <div onClick={()=>this.handleClick(1)}>
                1
            </div>
            <div onClick={()=>this.handleClick(2)}>
                2
            </div>
            <div onClick={()=>this.handleClick(3)}>
                3
            </div>
            <div onClick={()=>this.handleClick(4)}>
                4
            </div>
        </div>
        );
    }
}

export default MyApp

```

How do I do this? Am I correct in disabling the click from the `handleClick` function?

Thanks.