title: Show Hide elements Meteor way
body: <p>I have <code>table</code> with a lot of <code>tr</code>, when my page is load <strong>1st</strong> tr shows and <strong>2nd</strong> tr is hide, for example:</p>
  
  <pre><code>&lt;table&gt;
    &lt;tr&gt;&lt;/tr&gt; // shows
    &lt;tr&gt;&lt;/tr&gt; // hide
    &lt;tr&gt;&lt;/tr&gt; // shows
    &lt;tr&gt;&lt;/tr&gt; // hide
    ...
    ...
    etc.
  &lt;/table&gt;
  </code></pre>
  
  <p><strong>What I want to build:</strong> When you click on "show" tr, lower tr (which is located underneath) must shows too, and when you clicked on "NEW" shows tr it must hide (like toggle)</p>
  
  <p><strong>PROBLEM:</strong> When I clcked on "show" tr, ALL "hide" tr shows too, <strong>NOT</strong> one which is located underneath</p>
  
  <p><strong>My CODE:</strong></p>
  
  <pre><code>&lt;template name="postJobs"&gt;
    &lt;tr class="smallInfo"&gt;
      // some code
    &lt;/tr&gt;
    {{#if showFullContent}}
    &lt;tr class=" bigInfo"&gt;
      // some code
    &lt;/tr&gt;
    {{/if}}
  &lt;/template&gt;
  
  
  Template.postJobs.helpers({
    showFullContent:function(){
      return Session.get('showContent');
     }
  });
  
  Template.postJobs.events({
    'click .smallInfo':function(){
      Session.set('showContent',true);
    },
    'click .bigInfo':function(){
      Session.set('showContent',false);
    },
  });
  </code></pre>
  
  <p>I dont want to use jQuery</p>