change Phone prefix on basis of country jQuery

prefix.html

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<select name="select1" id="select1">
  <option country-code="pk" value="Pakistan">Pakistan</option>
  <option country-code="in" value="India">India</option>
  <option country-code="us" value="Usa">USA</option>
  <option country-code="uk" value="Uk">United Kingdom</option>
  <option country-code="fr" value="France">France</option>
  <option country-code="gr" value="Germny">Germny</option>
  <option country-code="it" value="Italy">Italy</option>
  <option country-code="ch" value="China">China</option>

</select>


<select name="select2" id="select2">
  <option country-code="pk" value="92"> +92 PK</option>
  <option country-code="in" value="92">+91 IN</option>
  <option country-code="us" value="90">+90 US</option>
  <option country-code="uk" value="89">+89 UK</option>
  <option country-code="fr" value="88">+88 FR</option>
  <option country-code="gr" value="87">+87 GR</option>
  <option country-code="it" value="86">+86 IT</option>
  <option country-code="ch" value="85">+85 CH</option>
</select>

<script type="text/javascript">
$("#select1").change(function() {
  if ($(this).data('options') === undefined) {
    /*Taking an array of all options-2 and kind of embedding it on the select1*/
    $(this).data('options', $('#select2 option').clone());
  }
  //var id = $(this).val();
  var id = jQuery('#select2 option:selected').attr("country-code");
  var options = $(this).data('options').filter('[country-code=' + id + ']');
  $('#select2').html(options);
});
</script>