title: After adding JSON data to an html option selector, how can I reference other data when selected?
body: <p>I'm not sure of the proper terminology here so let me show my code:</p>
  
  <pre><code>var json = "https://example.com/";
  
  $.getJSON(json,function(data) {
      for (var x = 0; x &lt; data.length; x++) {
  
          $('#select').append(
              '&lt;option value="' + data[x].name + '"&gt;' + data[x].name + '&lt;/option&gt;'
          );
      }
  });
  </code></pre>
  
  <p>The JSON Data looks like the following but has much more data:</p>
  
  <pre><code>[
  {
      "id": "test1", 
      "name": "test1", 
      "symbol": "t1", 
      "rank": "1", 
      "price_usd": "55"
  }, 
  {
      "id": "test2", 
      "name": "test2", 
      "symbol": "t2", 
      "rank": "2", 
      "price_usd": "155"
  }
  ]
  </code></pre>
  
  <p>Essentially when someone uses the select option and choses "test1" I want to display the other information, such as; id, symbol, rank, etc.. What's the best way to go about this dynamically and not write a bunch of if statements?</p>