title: Conditionals in handlebars
body: <p>I want to add a class on a div based on part of my data set(JSON). This is what I have 
  data:</p>
  
  <pre><code>{
      "title":"energy star",
  
      "cat":"power",
  
      "diff":"Investment",
      "description":"When purchasing appliances, consider buying 'energystar' certified appliances to radically reduce the amount of electricity used by older appliances.",
      "links":[
          {
              "title":"The Official Website of Energystar",
              "url":"http://www.energystar.gov"
          }
      ],
      "cost":"$60+"
  },
  {
      "title":"shut the faucet",
      "cat":"water",
      "diff":"No-Cost",
      "description":"Turn off the water while you brush your teeth. There is never a good reason for waste.",
      "cost":"$0"
  },`
  </code></pre>
  
  <p>Here is my template </p>
  
  <pre><code>        {{#each this}}
          {{#addClasses}}
          {{/addClasses}}
  
          &lt;div class="tip_whole"&gt;
              &lt;div class="tip_header"&gt;
                  &lt;h5 class="tip_title"&gt;
                      &lt;b&gt;{{title}}&lt;/b&gt; - {{diff}}
                  &lt;/h5&gt;
                  &lt;div class="tip_social"&gt;
                      &lt;a href=""&gt;&lt;img src="IMG/media/twitter_16.png" alt="twiter link"/&gt;&lt;/a&gt;
                      &lt;a href=""&gt;&lt;img src="IMG/media/facebook_16.png" alt="facebook link"/&gt;&lt;/a&gt;
                      &lt;a href=""&gt;&lt;img src="IMG/media/email_16.png" alt="email link"/&gt;&lt;/a&gt;
                  &lt;/div&gt;
              &lt;/div&gt;{{!end .tip_title}}
              &lt;div class="tip_body"&gt;
                  &lt;div class="grid_20 alpha"&gt;
                      &lt;p class="tip_desc"&gt;{{description}}&lt;/p&gt;
                      {{#if links}}
                          &lt;div class="tip_links"&gt;
                          &lt;h5&gt;More information&lt;/h5&gt;
                          {{#each links}}
                                  &lt;a href="{{url}}" class="tip_link" target="_blank"&gt;{{title}}&lt;/a&gt;
                          {{/each}}
                          &lt;/div&gt;{{!end .tip_links}}
                      {{/if}}
                  &lt;/div&gt;{{!end .grid_20 alpha}}
                  &lt;div class="grid_19 push_2"&gt;
                      &lt;h2 class="tip_cost_title"&gt;Avg. Cost to Implement&lt;/h2&gt;
                      &lt;h1 class="tip_cost_title"&gt;{{cost}}&lt;/h1&gt;
                  &lt;/div&gt;
              &lt;/div&gt;{{!end .tip_body}}
          &lt;/div&gt;{{!end .tip_whole}}
      {{/each}}
  </code></pre>
  
  <p>and this is my helper function</p>
  
  <pre><code>Handlebars.registerHelper("addClasses",function(){
      if(this.cat=="water"){
              console.log('water');
              $(".tip_whole").addClass("water");
          } else {
              console.log('no water here');
          }
  });//end of helper function
  </code></pre>
  
  <p>It properly logs that there is water but it will never add the class, it will only affect the '.tip_whole' that is hardcoded but it will not affect the ones created by handlebars</p>