title: How to prevent parent div lose focus when child element is clicked
body: <pre><code>&lt;parent onBlur={function}&gt;
    &lt;child&gt;
      &lt;child&gt;
      &lt;/child&gt;
    &lt;/child&gt;
  &lt;/parent&gt;
  </code></pre>
  
  <p>In a structure like this, I want to catch if parent element loses focus or not. I want to fire that behavior when clicked outside of the parent div. However, parent element loses its focus when I click child element as well. You can think this structure as dropdown menu. Is there a way to achieve this inside of the stateless react component? I cannot use jquery or other libraries. </p>