Jquery change <p> text programmatically

Question

EDIT: The solution was to add this to the profile page instead of the gender page.

$('#profile').live( 'pageinit',function(event){ $('p#pTest').text(localStorage.getItem('gender')); 

});

I have a paragraph with som text in a listview that I want to change programatically from another page after clikcing save.

EDIT: This is my listview in profile.html. When you click on the item you get to another page where you can save your gender. I want to change the paragraph in this listview to the gender that was changed from the other page.

<ul data-role="listview"   >     <li><a href="gender.html">         <img src="images/gender2.jpg" />         <h3>Gender</h3>         <p id="pTest">Male</p>     </a></li> </ul> 

The gender html page is just basic stuff with two radio buttons and a save button. Here is my javascript code(in a seperate file):

$('#gender').live('pageinit', function(event) {      var gender = localStorage.getItem('gender');     var boolMale = true;     if (gender == "female") boolMale = false;     $('#radio-choice-male').attr("checked",boolMale).checkboxradio("refresh");     $('#radio-choice-female').attr("checked",!boolMale).checkboxradio("refresh");      $('#saveGenderButton').click(function() {         if ($('#radio-choice-male').is(':checked'))             localStorage.setItem('gender', "male");         else localStorage.setItem('gender', "female");          $('#pTest').html('test'); //does not work          //$('p#pTest').text('test'); //does not work          //$('#pTest').text('test'); //does not work         $.mobile.changePage("profile.html");     }); }); 

I have tried this with javascript: $('p#pTest').text('test');

The text does not change however. (I know that the save button works). Is this possible?

Answer 1

Try the following, note that when the user refreshes the page, the value is "Male" again, data should be stored on a database.

$('button').click(function(){      $('#pTest').text('test') })

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script>  <p id="pTest">Male</p> <button>change</button>