title: I have a json file and when I click the button
body: <p>I have a json file and when I click the button, it displays only last json data(<em>Ipsum %40</em>). But I want to parse that way; it must display <em>"Lorem"</em> in <code>#choice1</code> <code>div</code> and <em>"Ipsum"</em> in <code>#choice2</code> <code>div</code>. How can I do that? Here are my codes below;    </p>
  
  <p><strong>JS:</strong></p>
  
  <pre><code>$("#getdata-button").click(function() {
    $.getJSON('json_data.txt', function(read_data) {
      $.each(read_data.result, function(i, data) {
        $("#choice1").html(data.option + data.percent);
        $("#choice2").html(data.option + data.percent);
      });
    });
  });
  </code></pre>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;button id="getdata-button"&gt;hello&lt;/button&gt;
  &lt;div id="choice1"&gt;&lt;/div&gt;&lt;br&gt;
  &lt;div id="choice2"&gt;&lt;/div&gt;
  </code></pre>
  
  <p><strong>JSON:</strong></p>
  
  <pre><code>{
    "result": [{
      "option": "Lorem",
      "percent": " %50"
    }, {
      "option": "Ipsum",
      "percent": " %32"
    }]
  }
  </code></pre>