how to get key value from list Items in html format in jquery to show respective detail page?

how to get key value from list Items in html format in jquery to show respective detail page?

Am newbie to jquery.. I have tried to get json array in html format using ajax call in jquery.. then I have tried to show the respective detail page when click on item in item list.. how to get key value from jquery?? .. I have tried to search in net .. but didnt get clear idea..
Below mentioned code:

<!DOCTYPE html>
<html>
<head>
<script src="jquery-2.0.2.min.js" type="text/javascript"></script>
</head>
<body>
<button id="action-button">Click me to load info!</button>
   
    <table id="info"></table>
   
<small>Demo created by <a href="https://twitter.com/AurelioDeRosa">Aurelio De Rosa</a></small>

<script>
$(document).ready(function(){
var tdarrayvalue=[];
$('#action-button').click(function() {
var datas;
   $.ajax({
      url: 'jsondata.json',
      data: {
         format: 'json'
      },
      error: function() {
         $('#info').html('<p>An error has occurred</p>');
      },
      dataType: 'json',
     
      success: function(datas) {
   
           
            $.each(datas.joblist,function(key,val){
            var html = '<tr class="person-list-item"><tr><td>'+ val.name + '</td><td>' + val.salary + '</td></tr><tr><td>'+ val.description + '</td><td>' + val.location + '</td></tr></tr>';
            $('#info').append(html);
            });
            },
    type: 'GET'
   });
});
});
</script>
</body>
</html>