title: iterate over json object duplicates in handlebars
body: <p>I have the following JSON Object in my javascript:</p>
  
  <pre><code>var source = $("#template").html();
  var template = Handlebars.compile(source);
  
  var igListOrig = [
    {
      "IG":"Problem Solving", 
      "AIR_Indicators": "All Domain 1 Indicators* 3.1, 3.2, 3.3,     3.4", 
      "SMP": "SMP 1, 2, 3, 4, 5, 6, 7, and 8", 
      "Purpose": "Students must be able to reason, problem solve, communicate and make real life       decisions that require mathematical thinking.  Teaching students problem solving skills and giving them opportunities to apply their skills is critical to developing their capacity to solve mathematical problems that arise in all our lives (e.g. starting a small business, figuring out the area of a room in order to purchase the correct amount of paint, filling out a tax return, tracking and setting goals for investments, etc.)", 
      "IP":"Problem of the Week(PoW)", 
      "What": "PoWs are complex problems.",
      "When": "PoWs should be administered once per month.", 
      "How": "1.Introduce problem, process, and rubric. 2.Students are given time in class to work on problem throughout the week. 3.Students complete write up. 4.Student peer edit write up. 5.Students revise write up"
    },
  
    {
      "IG":"Problem Solving", 
      "AIR_Indicators": "All Domain 1 Indicators* 3.1, 3.2, 3.3, 3.4",   
      "SMP": "SMP 1, 2, 3, 4, 5, 6, 7, and 8",
      "Purpose": "Students must be able to reason, problem solve, communicate and make real life       decisions that require mathematical thinking.  Teaching students problem solving skills and giving them opportunities to apply their skills is critical to developing their capacity to solve mathematical problems that arise in all our lives (e.g. starting a small business, figuring out the area of a room in order to purchase the correct amount of paint, filling out a tax return, tracking and setting goals for investments, etc.)",
      "IP":"Problem of the Month (POM)", 
      "What": "The POMs are divided into five levels. Students are asked to explain their solutions and reasoning in a write up.",
      "When": "Students should work on problem the first 10-15 minutes of a period for 5-7 consecutive days. ",
      "How": "Write them on a pieces of paper." 
    },
  
    {
      "IG":"Problem Solving", 
      "AIR_Indicators": "All Domain 1 Indicators* 3.1, 3.2, 3.3, 3.4",
      "SMP": "SMP 1, 2, 3, 4, 5, 6, 7, and 8", 
      "Purpose": "Students must be able to reason, problem solve, communicate and make real life       decisions that require mathematical thinking.  Teaching students problem solving skills and giving them opportunities to apply their skills is critical to developing their capacity to solve mathematical problems that arise in all our lives (e.g. starting a small business, figuring out the area of a room in order to purchase the correct amount of paint, filling out a tax return, tracking and setting goals for investments, etc.)", 
      "IP":"Formative Assessment Lesson (FAL)", 
      "What": "FALs consist of 3 parts including a pre-assessment (approximately 15 min.",
      "When": "The 3 part cycle is intended to be given approximately two-thirds the way into a unit of study.", 
      "How": "1.Pre assessment. 2.Introduce activity. 3.Students work collaboratively. 4.Whole class discussion/ presentation. 5.Post assessment." 
    },
  
   {
      "IG":"Problem Solving", "AIR_Indicators": "All Domain 1 Indicators* 3.1, 3.2, 3.3, 3.4",
      "SMP": "SMP 1, 2, 3, 4, 5, 6, 7, and 8", 
      "Purpose": "Students must be able to reason, problem solve, communicate and make real life       decisions that require mathematical thinking.  Teaching students problem solving skills and giving them opportunities to apply their skills is critical to developing their capacity to solve mathematical problems that arise in all our lives (e.g. starting a small business, figuring out the area of a room in order to purchase the correct amount of paint, filling out a tax return, tracking and setting goals for investments, etc.)",   
      "IP":"Mathematics Assessment Resources (MARS)", 
      "What": "Story Problems.",
      "When": "Done at the begining of the unit.", 
      "How": "After each asssessment." }
  
  ]
  
  $('body').append(template(igListOrig));
  </code></pre>
  
  <p>And I want to iterate over this object so only when it iterates over the 2nd, 3rd, and 4th object I get a different "IP", "What", "When", and "How" each time AND ignore all the duplicities.  After each of the iterations only the "IP", "What", "When", and "How" are different.  I need to keep these differences and ignore other other duplicates.   </p>
  
  <p>I referenced something like this but I think this person's situation was a little different.
  <a href="https://stackoverflow.com/questions/18385307/iterating-over-a-json-object">Iterating over a JSON-Object</a></p>
  
  <p>Eventually this will go in a handlebars template like this</p>
  
  <pre><code>&lt;script id="template" type="text/x-handlebars-template"&gt;
  &lt;div class="container"&gt;
   {{#each this }}
      &lt;div class='titles'&gt;
        &lt;div class="left"&gt;Aspire Logo&lt;/div&gt;
        &lt;div class="middle"&gt;{{IG}}&lt;/div&gt;
        &lt;div class="right"&gt;Common Core&lt;/div&gt;
        &lt;div class="purple"&gt;&lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="split"&gt;
        &lt;div class="text"&gt;
          &lt;p class="split-heading"&gt;
            Aligned to the following &lt;span class="bold"&gt;AIR&lt;/span&gt; Indicators:
          &lt;/p&gt;
          &lt;ul&gt;
            &lt;li&gt;{{AIR_Indicators}}&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
        &lt;div class="text"&gt;
          &lt;p class="split-heading"&gt;
            Aligned to the following &lt;span class="bold"&gt;Standards of Mathematical Practice:&lt;/span&gt;
          &lt;/p&gt;
          &lt;ul&gt;
            &lt;li&gt;{{SMP}}&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
      &lt;/div&gt;
        &lt;div class="purpose heading"&gt;
          &lt;h3&gt;Purpose&lt;/h3&gt;
        &lt;/div&gt;
        &lt;div class="purpose text"&gt;
          &lt;p&gt;
            {{Purpose}}
          &lt;/p&gt;
        &lt;/div&gt;
      &lt;div class="process heading"&gt;
        &lt;h3&gt; Process &lt;/h3&gt;
      &lt;/div&gt;
  
      &lt;div class="bottom-container text"&gt;
          &lt;div class="cube"&gt;
            &lt;h4&gt;Instructional Practice&lt;/h4&gt;
            &lt;center&gt;&lt;h3&gt; {{IP}} &lt;/h3&gt; &lt;/center&gt; &lt;/br&gt;
            &lt;p&gt;&lt;span class="description"&gt;What&lt;/span&gt; {{What}} &lt;/p&gt;&lt;/br&gt;
            &lt;p&gt;&lt;span class="description"&gt;When&lt;/span&gt; {{When}} &lt;/p&gt;&lt;/br&gt;
            &lt;p&gt;&lt;span class="description"&gt;How&lt;/span&gt; {{How}} &lt;/p&gt;&lt;/br&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  {{/each}}
  &lt;/div&gt;
  &lt;/script&gt;
  </code></pre>
  
  <p>Eventually, the "IP", "What", "When", and "How" will look something like this near the bottom half of the document under the heading "Process"
  <a href="https://imgur.com/rV4PIFC" rel="nofollow noreferrer">http://imgur.com/rV4PIFC</a></p>
  
  <p>Here is the JS Fiddle I'm working with:
  <a href="http://jsfiddle.net/rr9Vz/" rel="nofollow noreferrer">http://jsfiddle.net/rr9Vz/</a></p>
  
  <p><strong>UPDATE</strong></p>
  
  <p>I just tried something like this</p>
  
  <pre><code>  var ips = [];
     for(var i in igListOrig) {
              var ip = igListOrig[i].IP + igListOrig[i].What + igListOrig[i].When +                     
              igListOrig[i].How ;
              if($.inArray(ip,ips)== -1 ){
                  ips.push(ip);
              }
          }
  </code></pre>
  
  <p>And I get the array that I need, but now how do I pass my templating AND this iteration through in handlebars?</p>
  
  <p><strong>UPDATE 2</strong></p>
  
  <p>For all intents and purposes the <code>&lt;div class='bottom-container text&gt;</code> needs to look like this when Handlebars compiles.</p>
  
  <pre><code>&lt;script id="template" type="text/x-handlebars-template"&gt;
     &lt;div class="container"&gt;
      &lt;div class='titles'&gt;
        &lt;div class="left"&gt;Aspire Logo&lt;/div&gt;
        &lt;div class="middle"&gt;{{IG}}&lt;/div&gt;
        &lt;div class="right"&gt;Common Core&lt;/div&gt;
        &lt;div class="purple"&gt;&lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="split"&gt;
        &lt;div class="text"&gt;
          &lt;p class="split-heading"&gt;
            Aligned to the following &lt;span class="bold"&gt;AIR&lt;/span&gt; Indicators:
          &lt;/p&gt;
          &lt;ul&gt;
            &lt;li&gt;{{AIR_Indicators}}&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
        &lt;div class="text"&gt;
          &lt;p class="split-heading"&gt;
            Aligned to the following &lt;span class="bold"&gt;Standards of Mathematical Practice:&lt;/span&gt;
          &lt;/p&gt;
          &lt;ul&gt;
            &lt;li&gt;{{SMP}}&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
      &lt;/div&gt;
        &lt;div class="purpose heading"&gt;
          &lt;h3&gt;Purpose&lt;/h3&gt;
        &lt;/div&gt;
        &lt;div class="purpose text"&gt;
          &lt;p&gt;
            {{Purpose}}
          &lt;/p&gt;
        &lt;/div&gt;
      &lt;div class="process heading"&gt;
        &lt;h3&gt; Process &lt;/h3&gt;
      &lt;/div&gt;  
    &lt;div class="bottom-container text"&gt;
      &lt;div class="cube"&gt;
        &lt;h4&gt;Instructional Practice&lt;/h4&gt;
        &lt;center&gt;&lt;h3&gt; Problem Solving&lt;/h3&gt; &lt;/center&gt; &lt;/br&gt;
        &lt;p&gt;&lt;span class="description"&gt;What&lt;/span&gt; PoWs are complex problems. &lt;/p&gt;&lt;/br&gt;
        &lt;p&gt;&lt;span class="description"&gt;When&lt;/span&gt; PoWs should be administered once per month. &lt;/p&gt;&lt;/br&gt;
        &lt;p&gt;&lt;span class="description"&gt;How&lt;/span&gt; 1.Introduce problem, process, and rubric. 2.Students are given time in class to work on problem throughout the week. 3.Students complete write up. 4.Student peer edit write up. 5.Students revise write up&lt;/p&gt;&lt;/br&gt;
      &lt;/div&gt;
      &lt;div class="cube"&gt;
        &lt;h4&gt;Instructional Practice&lt;/h4&gt;
        &lt;center&gt;&lt;h3&gt; Problem of the Month (POM) &lt;/h3&gt; &lt;/center&gt; &lt;/br&gt;
        &lt;p&gt;&lt;span class="description"&gt;What&lt;/span&gt; The POMs are divided into five levels. Students are asked to explain their solutions and reasoning in a write up. &lt;/p&gt;&lt;/br&gt;
        &lt;p&gt;&lt;span class="description"&gt;When&lt;/span&gt; Students should work on problem the first 10-15 minutes of a period for 5-7 consecutive days. &lt;/p&gt;&lt;/br&gt;
        &lt;p&gt;&lt;span class="description"&gt;How&lt;/span&gt; Write them on a pieces of paper. &lt;/p&gt;&lt;/br&gt;
      &lt;/div&gt;
      &lt;div class="cube"&gt;
        &lt;h4&gt;Instructional Practice&lt;/h4&gt;
        &lt;center&gt;&lt;h3&gt; Formative Assessment Lesson (FAL) &lt;/h3&gt; &lt;/center&gt; &lt;/br&gt;
        &lt;p&gt;&lt;span class="description"&gt;What&lt;/span&gt; FALs consist of 3 parts including a pre-assessment (approximately 15 min. &lt;/p&gt;&lt;/br&gt;
        &lt;p&gt;&lt;span class="description"&gt;When&lt;/span&gt; The 3 part cycle is intended to be given approximately two-thirds the way into a unit of study. &lt;/p&gt;&lt;/br&gt;
        &lt;p&gt;&lt;span class="description"&gt;How&lt;/span&gt; 1.Pre assessment. 2.Introduce activity. 3.Students work collaboratively. 4.Whole class discussion/ presentation. 5.Post assessment. &lt;/p&gt;&lt;/br&gt;
      &lt;/div&gt;
      &lt;div class="cube"&gt;
        &lt;h4&gt;Instructional Practice&lt;/h4&gt;
        &lt;center&gt;&lt;h3&gt; Mathematics Assessment Resources (MARS)&lt;/h3&gt; &lt;/center&gt; &lt;/br&gt;
        &lt;p&gt;&lt;span class="description"&gt;What&lt;/span&gt; Story Problems. &lt;/p&gt;&lt;/br&gt;
        &lt;p&gt;&lt;span class="description"&gt;When&lt;/span&gt; Done at the begining of the unit. &lt;/p&gt;&lt;/br&gt;
        &lt;p&gt;&lt;span class="description"&gt;How&lt;/span&gt; After each asssessment. &lt;/p&gt;&lt;/br&gt;
      &lt;/div&gt;
   &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I want this: <a href="http://jsfiddle.net/8Xnpk/1/" rel="nofollow noreferrer">http://jsfiddle.net/8Xnpk/1/</a></p>
  
  <p>but I'm getting this:  <a href="http://jsfiddle.net/rr9Vz/3/" rel="nofollow noreferrer">http://jsfiddle.net/rr9Vz/3/</a></p>
  
  <p>@MarcoCl's solution works in terms of code execution, but for whatever eason I can't seem to get this <a href="http://jsfiddle.net/8Xnpk/1/" rel="nofollow noreferrer">http://jsfiddle.net/8Xnpk/1/</a></p>