jQueryのgetJSONのコンテンツを新しいdiv

Question

私が助けてくれますか？新しいdivを Iv got this one. All is going into one div

に私のデータをロードする方法And how to make right that

イムだけでどのように作るかを尋ね：

[ 
{ 
"name":"wat1", 
"number":"42306810738002982912", 
"city":"mat1", 
"amount":"50 000,00", 
"currency":"qwe1", 
"rate":"7,40%" 
}, 
{ 
"name":"wat2", 
"number":"42306840338002521455", 
"city":"mat2", 
"amount":"153,85", 
"currency":"qwe2", 
"rate":"2,85%" 
}, 
{ 
"name":"wat3", 
"number":"42307752138002500019", 
"city":"mat3", 
"amount":"1500,00", 
"currency":"qwe3", 
"rate":"0,01%" 
} 
] 

：divのは、JSONファイルに応じて、自動的に（データ量）

私のJSONを作成する必要があります

スクリプト：

$(document).ready(function(){ 
$.getJSON("accounts.json", function(data){ 
$.each(data, function(key, value){ 
$("name").append(value.name) 
$("number").append(value.number) 
$("city").append(value.city) 
$("amount").appoend(value.amount) 
$("currency").append(value.currency) 
$("rate").append(value.rate); 
}); 
}); 
}); 

とhtml：

 <div class="deposit-small-block first-block size-small-block tt" onclick="view('t1'); return false"> 
      <div class="button_block"> 
       <div class="div-for-button"> 
        <input type="radio" name="on"> 
       </div> 
      </div> 
      <div class="deposit-form-block-name"> 
       <div class="deposit-form-block-name-first white-text"><name></name></div> 
       <div class="deposit-form-block-name-second white-text"><number></number></div> 
       <div class="deposit-form-block-name-third white-text"><city></city></div> 
      </div> 
      <div class="deposit-form-block-sum"> 
       <div class="deposit-form-block-sum-text white-text"> 
        <amount></amount><br><currency></currency> 
       </div> 
      </div> 
      <div class="deposit-form-block-perc"> 
       <div class="deposit-form-block-sum-text white-text"><rate></rate></div> 
      </div> 
     </div> 

Answer 1

/* 
 

 
var data = [ 
 
{ 
 
"name":"wat1", 
 
"number":"42306810738002982912", 
 
"city":"mat1", 
 
"amount":"50 000,00", 
 
"currency":"qwe1", 
 
"rate":"7,40%" 
 
}, 
 
{ 
 
"name":"wat2", 
 
"number":"42306840338002521455", 
 
"city":"mat2", 
 
"amount":"153,85", 
 
"currency":"qwe2", 
 
"rate":"2,85%" 
 
}, 
 
{ 
 
"name":"wat3", 
 
"number":"42307752138002500019", 
 
"city":"mat3", 
 
"amount":"1500,00", 
 
"currency":"qwe3", 
 
"rate":"0,01%" 
 
} 
 
]; 
 

 

 
*/ 
 
function buildRow(a,b,c,d,e,f){ 
 
return '<div class="deposit-small-block first-block size-small-block tt" onclick="view(\'t1\'); return false">\ 
 
      <div class="button_block">\ 
 
       <div class="div-for-button">\ 
 
        <input type="radio" name="on">\ 
 
       </div>\ 
 
      </div>\ 
 
      <div class="deposit-form-block-name">\ 
 
       <div class="deposit-form-block-name-first white-text"><name>'+a+'</name></div>\ 
 
       <div class="deposit-form-block-name-second white-text"><number>'+b+'</number></div>\ 
 
       <div class="deposit-form-block-name-third white-text"><city>'+c+'</city></div>\ 
 
      </div>\ 
 
      <div class="deposit-form-block-sum">\ 
 
       <div class="deposit-form-block-sum-text white-text">\ 
 
        <amount>'+d+'</amount><br><currency>'+e+'</currency>\ 
 
       </div>\ 
 
      </div>\ 
 
      <div class="deposit-form-block-perc">\ 
 
       <div class="deposit-form-block-sum-text white-text"><rate>'+f+'</rate></div>\ 
 
      </div>\ 
 
     </div>' 
 
} 
 

 
$(document).ready(function(){ 
 
$.getJSON("accounts.json", function(data){ 
 
data = JSON.parse(data); 
 
$.each(data, function(key, value){ 
 
$("#main_list").append(
 
buildRow(value.name 
 
,value.number 
 
,value.city,value.amount,value.currency,value.rate) 
 
); 
 
}); 
 
}); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id='main_list'> 
 

 
</div>