javascript - 如何从同一个类的div中获取文本值，并显示在另一个div中？

Question

此处示例:http://codepen.io/agentmi6/pen/JoZZWm

当我点击 [+] 图标时，如何在灰色 div 中显示绿色 div 的文本？我尝试了很多不同的方案，但都没有用，有人可以给我一些指示，我该怎么做，我真的很感激。

    <div id="wrapper">
      <div class="container">
        <div class="first" id="f">
          <div class="set">+</div>
          this is the 1st element
        </div>
        <div class="first" id="s">
          <div class="set">+</div>
          this is the 2nd element
        </div>
        <div class="first" id="t">
          <div class="set">+</div>
          this is the 3rd element
        </div>
      </div>

      <div id="cc"></div>
    </div>

CSS

.first{
  margin-top:5px;
  border:1px solid black;
  width:190px;
  height:40px;
  background-color:green;
}

#cc{
  margin-top:5px;
  width:190px;
  height:40px;
   border:1px solid black;
  background-color:grey;
}

.set{
  cursor:pointer;
  color:#fff;
  font-size:33px;
  float:right;
  border:1px solid white;
}

Answer 1

你必须获取.first div的文本，我建议你将文本放在标签中，这样很容易获取，所以你不会得到.get 按钮 的+。这是新的 JavaScript

$(document).ready(function(){

  $('.set').click(function(){

    // Get the text inside the span in the parent .first of the clicked .set button
    var text = $(this).parent('.first').find('span').text();
    $('#cc').text(text);
 });

});

HTML 看起来像这样

<div class="container">
  <div class="first" id="f">
    <div class="set">+</div>
    <span>this is the 1st element</span>
  </div>
  <div class="first" id="s">
    <div class="set">+</div>
    <span>this is the 2nd element</span>
  </div>
  <div class="first" id="t">
    <div class="set">+</div>
    <span>this is the 3rd element</span>
  </div>
</div>
<div id="cc"></div>

这是更新的 CodePen