title: Building Tree Using Javascript and JSON
body: <p>i have a JSON array have the following data structure</p>
  
  <pre><code>"Jobs":
          [
              { "id": "1", "JobTitle": "Engineer", "PID": "null" },
              { "id": "2", "JobTitle": "Project Manager", "PID": "null" },
              { "id": "5", "JobTitle": "Auditing Manager", "PID": "2" },
              { "id": "7", "JobTitle": "Auditor", "PID": "5" },
              { "id": "6", "JobTitle": "QA Manager", "PID": "5" },
              { "id": "3", "JobTitle": "QA", "PID": "6" },
              { "id": "4", "JobTitle": "Business Analyst", "PID": "2" }
          ]
  </code></pre>
  
  <p>i want to write a java script using Jquery and Knockoutjs (optional) to build a team structure (organization) with javascript and html, i have like 1000 record i have tried many recursive loops to handle it with no success.</p>
  
  <p>the out put should be like this</p>
  
  <pre><code>&lt;ul id="root"&gt;
  &lt;li&gt;Engineer&lt;/li&gt; //since their pid is null, then they are root nodes ( yeah not only root)
  &lt;li&gt;Project Manager&lt;/li&gt;
     &lt;ul&gt;
     &lt;li&gt;Auditing Manager&lt;/li&gt;
     &lt;li&gt;Business Analyst&lt;/li&gt;
     &lt;/ul&gt;
  </code></pre>
  
  <p>and so on, it should handle many levels (depth), somebody will suggest DFS or BFS but i couldn't implement them successfully.</p>