jquery - Making sure elements changed by javascript remain changed when user returns to page without refreshing -

sorry wonky title, had hard time describing problem. also, sorry if duplicate hard search for.

i'm trying implement relatively ajax call on button press using jquery. goal have button either says "add list" or "remove list" and, when pressed, makes ajax call server adds/removes item list appropriately. on success, button changed reflect change on end (so add to->remove , vice versa) jquery.

i'd work if user doesn't have javascript enabled (which idea, right?) button within standard html form makes post call, db stuff, , redirects user webpage on. override default behaviour jquery.

in order display correct button type when user first loads page, , when standard post call javascript enabled, use django's templating system display correct button/hidden values in form.

this works , good... part. problem i'm having when user clicks button using javascript, goes page, uses page button return page, changes not retained. is, button displayed rendered django on first page load. fixed if user reloads page.

this, of course, confusing user button not correctly reflect state of db. how can fix this?

unfortunately, there's no real answer one. button returns version of page cached on users browser, , interacts poorly many forms of dynamic content. might consider trying convince users not use button (made easier robust navigation bar or equivalent can use instead) or putting in helpful note. there various meta-tages can put in tell browser not cache page (thus causing them load every time), can slow things down, , may not followed browsers.