title: how to show div on under button on onclick event
body: <p>From this code i have three button ,now i cliked ** Reply button 1** means i want to show one textarea for bottom of the button( Reply button 1).else i have to select  Reply button 2 means i want show the textarea for under this  Reply button 2..i don't know how to do.i am new developer please help me some one</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="comment"&gt;
    &lt;div class="img-thumbnail"&gt;
      &lt;img class="avatar" alt="" src="../TV/dist/img/user2-160x160.jpg"&gt;
    &lt;/div&gt;
    &lt;div class="comment-block"&gt;
      &lt;div class="comment-arrow"&gt;&lt;/div&gt;
      &lt;span class="comment-by"&gt;
        &lt;strong&gt;Kani&lt;/strong&gt;
        &lt;span class="pull-right"&gt;
         &lt;a href="javascript:void(0)" rel="&lt;?php echo $com['id']//1?&gt;" class="reply-btn"&gt;&lt;i class="fa fa-reply"&gt;&lt;/i&gt; Reply button 1&lt;/a&gt;
        &lt;/span&gt;
      &lt;/span&gt;
      &lt;p&gt;Lorem ipsum dolor sit amet,&lt;/p&gt;
      &lt;span class="date pull-right"&gt;19-Apr-2016 &lt;/span&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  
  
  &lt;div class="comment"&gt;
    &lt;div class="img-thumbnail"&gt;
      &lt;img class="avatar" alt="" src="../TV/dist/img/user2-160x160.jpg"&gt;
    &lt;/div&gt;
    &lt;div class="comment-block"&gt;
      &lt;div class="comment-arrow"&gt;&lt;/div&gt;
      &lt;span class="comment-by"&gt;
        &lt;strong&gt;Kani&lt;/strong&gt;
        &lt;span class="pull-right"&gt;
         &lt;a href="javascript:void(0)" rel="&lt;?php echo $com['id']//2?&gt;" class="reply-btn"&gt;&lt;i class="fa fa-reply"&gt;&lt;/i&gt; Reply button 2&lt;/a&gt;
        &lt;/span&gt;
      &lt;/span&gt;
      &lt;p&gt;Lorem ipsum dolor sit amet,&lt;/p&gt;
      &lt;span class="date pull-right"&gt;19-Apr-2016 &lt;/span&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  
  
  &lt;div class="comment"&gt;
    &lt;div class="img-thumbnail"&gt;
      &lt;img class="avatar" alt="" src="../TV/dist/img/user2-160x160.jpg"&gt;
    &lt;/div&gt;
    &lt;div class="comment-block"&gt;
      &lt;div class="comment-arrow"&gt;&lt;/div&gt;
      &lt;span class="comment-by"&gt;
        &lt;strong&gt;Kani&lt;/strong&gt;
        &lt;span class="pull-right"&gt;
         &lt;a href="javascript:void(0)" rel="&lt;?php echo $com['id']//3?&gt;" class="reply-btn"&gt;&lt;i class="fa fa-reply"&gt;&lt;/i&gt; Reply button 3&lt;/a&gt;
        &lt;/span&gt;
      &lt;/span&gt;
      &lt;p&gt;Lorem ipsum dolor sit amet,&lt;/p&gt;
      &lt;span class="date pull-right"&gt;19-Apr-2016 &lt;/span&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>After click that button i want to show this </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>  &lt;textarea class="the-new-com"&gt;&lt;/textarea&gt;  </code></pre>
  </div>
  </div>
  </p>