title: React Need to toggle a div when an edit is clicked for one object in json array(open/Close)
body: <p>I have a json array and i am iterating array and show the list ,each have its own id.
  Each having edit button and when you click on edit ,it shoudl show a div ,inside div i have a dummy text,like wise when i click the edit of next object from JSON array,already openend div of previous object should close and the new JSON object edit div should toggle</p>
  
  <pre><code>&lt;div&gt;
                &lt;li key={contact.id}&gt;
                  &lt;p&gt;{contact.firstName} {contact.lastName}&lt;/p&gt;
                  &lt;p&gt;{contact.email}&lt;/p&gt;
                  &lt;button onClick={() =&gt; this.removeContact(contact.id)}&gt;Remove&lt;/button&gt;
                  &lt;button onClick={() =&gt; this.showEditDiv(contact.id)}&gt;Edit&lt;/button&gt;
                  &lt;div className=""&gt;
                    &lt;p&gt;This is edit form&lt;/p&gt;
                  &lt;/div&gt;
                &lt;/li&gt;
              &lt;/div&gt;
  </code></pre>
  
  <p>Any live demo or jsfiddle will be highly grateful and appreciated</p>