title: how to show/hide input type:text when button is click
body: <p><strong>reply button</strong></p>
  
  <pre><code>&lt;div id="replybutton" class="btn4 like" style="margin-top:-25px;margin-left:-10px;"&gt;
     &lt;span class="btn reply" id="replyb"&gt;Reply&lt;/span&gt; 
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>input field</strong></p>
  
  <pre><code>&lt;div  class="col-lg-12" style="background:#eff9c7;"&gt;
      &lt;input type="text"  id="reply" class="form-control pull-right" style="width:88%;height:25px;margin-top:-10px;" placeholder="Write a reply..." /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>so here what im trying to make is when i reload the page the input field should be hidden and when i click the reply button it will show.. and when i click it again it will hide.. i tried using <code>toggle()</code> on jquery it works but the problem is if i reload the page the button is visible which is not the right thing.. i even tried to use <code>.show()</code> and <code>.hide()</code> but it seems im missing something so it doesn't work on my end. is there any way i can make it happens that when i reload the page the input field should be hidden.. </p>