Display Text On Click Inside Different DIV

Question

I have three divs. One div has a Twitter icon, one div has a LinkedIn icon and the last div is where I want text to display onclick.

I would like to be able to click on the Twitter icon and have text display in that third div. Then if I click on the LinkedIn icon, the text will change and display specific text for LinkedIn. These are not feeds. Right now I can click on the Twitter icon and the text will display but it displays under the icon and I need it to display in the third div that says "Posts Go Here."

The main page is .php.

Code for divs is:

<div class="capamb-row-padding">
    <div class="capamb-third">
      <p><label for="toggle">
      <img src="/images/capambassador/capamb-twitter-icon.png" width="75" height="75" />
      </label>
      <input type="checkbox" id="toggle" />
      <span>your text here</span>
    </div>

   <div class="capamb-third">
       <p><img src="/images/capambassador/capamb-linkedin-icon.png" width="75" height="75" /></p>
    </div>

    <div class="capamb-third">
        <h2>Tweets</h2>
        <p>Posts Go Here</p>
    </div>
</div>

Answer 1

Check the below snippet.

$(function() {
  $('img[alt="twitter"]').click(function() {
    $('div.capamb-third:nth-child(3) h2').text('Tweets');
    $('div.capamb-third:nth-child(3) p').text('Twitter Posts Go Here');
  });
  $('img[alt="linkedin"]').click(function() {
    $('div.capamb-third:nth-child(3) h2').text('Posts');
    $('div.capamb-third:nth-child(3) p').text('LinkedIn Posts Go Here');
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="capamb-row-padding">
  <div class="capamb-third">
    <p>
      <label for="toggle">
        <img src="/images/capambassador/capamb-twitter-icon.png" width="75" height="75" alt="twitter" />
      </label>
      <input type="checkbox" id="toggle" />
      <span>your text here</span>
  </div>
  <div class="capamb-third">
    <p>
      <img src="/images/capambassador/capamb-linkedin-icon.png" width="75" height="75" alt="linkedin" />
    </p>
  </div>
  <div class="capamb-third">
    <h2>Tweets</h2>
    <p>Posts Go Here</p>
  </div>
</div>