title: Pass data between 2 React DOM
body: <p>In a website, I have multiple react rendering elements. I want to pass the data between this 2 individual elements. What are the possible options for passing the data between 2 elements </p>
  
  <pre><code>ReactDOM.render(&lt;Header/&gt;, document.getElementById('header'));
  ReactDOM.render(&lt;SideBar/&gt;, document.getElementById('sidebar'));
  </code></pre>
  
  <p>I want to have a single data storage between these elements. Like I get data in one component and I want that data to be accessible in all the elements (in all ReactDOM). 
  So what can be the possible options for this? </p>
  
  <p>Edit: Due to requirement I can't merge them in to same root component. Only some portion of page is in react other is still in the HTML/Jquery. So I render them individually in the required div.</p>
  
  <p>Does redux store work between different ReactDOMs? </p>