用父子json格式渲染json

Question

我有一个html文件，其中有来自json的父级和子级数据，我只需要在此处使用父级和特定的子级进行渲染，我在这里尝试过，但是只有第一个父级和子级像parent1-child11child12一样传入，但是我需要这里 parent1-child11 child12，parent2-child2，parent1-child3类似于json。这是下面的代码，或者您可以检查plunkr http://plnkr.co/edit/KhFhW4Z3Kk4QwvRDr1pX?p=preview

html

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
<div class="col-md-3" id="leftNavBar">
<div class="applybutton"><button class="applybtn" type="button">Appply</button></div> 
<div><span class="parent"></span>-<span class="child"></span></div>
</div>

脚本

  $(".applybtn").click(function(){
    $.ajax({
          type: "GET",
          url: '1.json',
          success: function(result) {
           console.log(result[0].value);

           $('.parent').append(result[0].name);
            $('.child').append(result[0].value);
          }
        });
      });