title: HTML multiple Tables
body: <p>Please help me ! </p>
  
  <p>I have two divs, in each div is a table. How can I change the content of first table by clicking in the second table.<br>
  The first table is on the left side, and the second table is on the right side. "Image 1" </p>
  
  <blockquote>
    <p><a href="https://i.stack.imgur.com/pKpYz.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/pKpYzm.jpg" alt="Image 1"></a></p>
  </blockquote>
  
  <p>I want to change the content on the left table by clicking on the right table on the "Table 1" , "Table 2" </p>
  
  <p>One more thing, how can I keep the both tables in line when the content of the first table is to long. when I add more data in the first table the tables are changing their position like this</p>
  
  <blockquote>
    <p><a href="https://i.stack.imgur.com/5m2iB.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/5m2iBm.jpg" alt="Image 2"></a></p>
  </blockquote>