refreshing a page on jquery mobile

Question

I am making a dynamic list in jquery mobile, based on a JSON file in my local storage (not a PHP file, just local storage) the list gets rebuilt every time you go to that page based on items that were removed or added to it, it is all in jquery mobile, however, when I go back to the list I have to manually press refresh to update it, i tried using

$('#myListPage').on('pageshow', function(){
  window.location.reload(true);
});

However, it does not seem to do anything, everything works great if I manually press F5 or refresh.

This is how the list is created every time:

function run2() { 
  peopleList();
  $("#list").listview("refresh").trigger("create");
};


function peopleList() {
    $("#peopleList ul li").each().remove();
    for (i = 0; i < cars.length; i++) {
        if (cars[i].availability == "true") {
            $("#peopleList ul").append('<li value = ' + i + ' id="colas">' + '<div  data-role="collapsible" data-theme="b" data-content-theme="a">' + '<h3>' + cars[i].carName + '</h3>' + '<span data-inset="true">' + '<img src="' + cars[i].imageSrc + '" style="width:auto; margin:0px auto" id="imgcar"/>' + '<h2>' + cars[i].carModel + ", " + cars[i].gear + "</h2> " + '</span>' + '<input type="button" value="Select this car" data-icon="check" onclick="aval(' + i + ')"/></div>' + '</li>');
        }
    }
}

Sorry if it has a simple answer I am new at this, I am trying to learn but my instructions were to use local storage only, not php, thank you guys very much in advance.

Edit:

Here is the html of the code

<div data-role="page" id="catalog">
  <div data-role="header" data-theme="a">
    <h1>Choose your car!</h1>
  </div>
  <div data-role="content" id="peopleList" class="ui-grid-b">
    <ul data-role="listview" data-inset="true" id="list" class="ui-block-a">
    </ul>
    <div class="ui-block-c">
      <canvas id ="myCanvas"  style="margin-left:100px; width:300px; height:300px"></canvas>
    </div>
    <div class="ui-block-b"></div>
  </div>
  <div data-role="footer" data-position="fixed"  class="copyright"><h2> &copy  </h2></div>
</div>

Answer 1

after a long search in the dark corners of the internet i found a command that does the trick, i have no idea what it means or how it does it but it works.

var path = location.pathname;
var filename = path.match(/.*\/([^/]+)\.([^?]+)/i)[1]+".html";
location.href= filename;

Answer 2

You can refresh your listview by this :

$('#peopleList').listview('refresh');  

check documentation here : http://jquerymobile.com/demos/1.2.1/docs/lists/docs-lists.html

Answer 3

how if use :

$(document).ready(function(){
    //window.location.reload(true);
    location.href = 'url';
});