title: Create tree table from JSON object using jQuery
body: <p>I have following data structure coming as a JSON object from server side</p>
  
  <pre><code>var data = {
      "name": "preprodwizard",
      "cSVServers": [{
          "name": "preprodwizard_80_csvs",
          "status": "UP",
          "ipAddress": "162.115.34.53",
          "port": "80",
          "protocol": "HTTP",
          "lBVServers": [{
              "name": "preprodwizard_static_lbvs",
              "status": "UP",
              "ipAddress": "0.0.0.0",
              "port": "0",
              "protocol": "HTTP",
              "serviceGroups": [{
                  "name": "preprodwizard_static_30443_sg",
                  "status": "--",
                  "ipAddress": "--",
                  "port": "--",
                  "protocol": "--",
                  "servers": [{
                      "name": "--",
                      "status": "UP",
                      "ipAddress": "10.255.48.28",
                      "port": "30443",
                      "protocol": "--"
                  }, {
                      "name": "--",
                      "status": "UP",
                      "ipAddress": "10.255.48.37",
                      "port": "30443",
                      "protocol": "--"
                  }]
              }]
          }]
      }, {
          "name": "preprodwizard_443_csvs",
          "status": "UP",
          "ipAddress": "162.115.34.53",
          "port": "443",
          "protocol": "SSL",
          "lBVServers": [{
              "name": "preprodwizard_static_lbvs",
              "status": "UP",
              "ipAddress": "0.0.0.0",
              "port": "0",
              "protocol": "HTTP",
              "serviceGroups": [{
                  "name": "preprodwizard_static_30443_sg",
                  "status": "--",
                  "ipAddress": "--",
                  "port": "--",
                  "protocol": "--",
                  "servers": [{
                      "name": "--",
                      "status": "UP",
                      "ipAddress": "10.255.48.28",
                      "port": "30443",
                      "protocol": "--"
                  }, {
                      "name": "--",
                      "status": "UP",
                      "ipAddress": "10.255.48.37",
                      "port": "30443",
                      "protocol": "--"
                  }]
              }]
          }, {
              "name": "preprodwizard_web_lbvs",
              "status": "UP",
              "ipAddress": "0.0.0.0",
              "port": "0",
              "protocol": "HTTP",
              "serviceGroups": [{
                  "name": "preprodwizard_web_28443_sg",
                  "status": "--",
                  "ipAddress": "--",
                  "port": "--",
                  "protocol": "--",
                  "servers": [{
                      "name": "--",
                      "status": "UP",
                      "ipAddress": "10.255.48.28",
                      "port": "28443",
                      "protocol": "--"
                  }, {
                      "name": "--",
                      "status": "UP",
                      "ipAddress": "10.255.48.37",
                      "port": "28443",
                      "protocol": "--"
                  }]
              }]
          }]
      }]
  };
  </code></pre>
  
  <p>Now I want to create a Tree table structure out of this JSON object. e.g.</p>
  
  <p>There would be multiple csvServers, each csvServer will have some properties like name / status / ipAddress / Port / Protocol which will be in one row</p>
  
  <p>Now each csvServer will have IBVServers, each IBVServer will have ServiceGroups and each ServiceGroups will have Servers.</p>
  
  <p>How can I create this tree table <a href="http://wwwendt.de/tech/dynatree/doc/samples.html" rel="nofollow noreferrer">http://wwwendt.de/tech/dynatree/doc/samples.html</a> for above data structure.</p>