how to save data that come from json using ajax

how to save data that come from json using ajax

i have script that get from server data using ajax and it's good . but if i try to reuse the data that comfrom json in another script it's not know the variable .My guess because the Anonymous function . can anybody can tel me what i need to do to be able to reuse the data that come from the server.without made calling to the server again .

i attach the code that you can see .

  2. <!DOCTYPE html>
  3. <html>
  4. <head>
  5.     <title>First jQuery Mobile Example</title>
  6.     <!-- the three things that jQuery Mobile needs to work -->
  7.     <link rel="stylesheet" href="jquery.mobile-1.4.2/jquery.mobile-1.4.2.css" />
  8.     <script src="jquery-1.11.0.js" type="text/javascript"></script>
  9.     <script src="jquery.mobile-1.4.2/jquery.mobile-1.4.2.js" type="text/javascript"></script>
  10.     <meta name="viewport" content="width=device-width"/>

  12.     <script>
  13.         var output = '';

  15.         $.ajax({
  16.             url: 'https://c9.io/a1_shay/blabla/workspace/myFirstJson.json',
  17.             dataType: 'json',
  18.             type: 'get',
  19.             cache: false,
  20.             success: function(data)
  21.             {
  22.                 $(data.articles).each(function(index, value)
  23.                         {
  24.                             output += '<li>' +
  25.                                     '<a href="' + '#secondpage' + '" onclick=getDataById("'+ value.name +'")>' +
  26.                                     value.name + '</a>' + '</li>';
  27.                         }
  28.                 )
  29.                 console.log(output);
  30.                 var update = document.getElementById('listOfItemes');
  31.                 update.innerHTML = output;
  32.                 $('#listOfItemes').listview('refresh');
  33.             }
  34.         })

  36.     </script>

  38.     <script>
  39.         function getDataById(id)
  40.         {
  41.             var showOnTheScreeen;

  43.             $(data.articles).each(function(index, value)
  44.                     {


  47.                             alert(id);

  49.                     }
  50.             )
  51.         }
  52.     </script>
  53. </head>
  54. <body>


  57. <!-- This is the first page -->
  58. <section id="firstpage" data-role="page">
  59.     <div data-role="header">
  60.         <h1>Page Content Header</h1>
  61.     </div>

  63.     <ol data-role="listview" data-autodividers="true" data-filter="true" data-inset="true" id="listOfItemes">
  64.     </ol>

  66.     <div class="ui-content" role="main">
  67.         <p>This is the content on page 1</p>
  68.         <p><a href="#secondpage?aaa=bb" data-parm="john !!!!">Go to second page</a></p>
  69.     </div>
  70.     <div data-role="footer">
  71.         <h2>Page Content Footer</h2>
  72.     </div>
  73. </section>

  75. <!-- This is the second page -->
  76. <div id="secondpage" data-role="page">
  77.     <div data-role="header">
  78.         <h1>Page Content Header</h1>
  79.     </div>

  81.     <div id="detailsOnPerson">
  82.     </div>

  84.     <div class="ui-content" role="main">
  85.         <p>Page 2 has different content on it</p>
  86.         <p><a href="#firstpage">Go to first page</a></p>
  87.     </div>
  88.     <div data-role="footer">
  89.         <h2>Page Content Footer</h2>
  90.     </div>
  91. </div>

  93. </body>
  94. </html>