Strange problem with jQuery $.load();

I've encountered another problem with jQuery $.load(). I have two buttons, their visibility is mutually exclusive. A PHP conditional statement determines which is shown. All of that is contained in a div element #subDiv. Once either button is pressed, a PHP post file (two slightly different files for the two different buttons) is ran, and it writes a value to a database. Then, upon post success, I use $.load() to refresh #subDiv, which would (in theory) run the conditional again, and determine that the button that was not there last will now be shown.

My problem is the following:

• When I click on the button when it is in State A, it will post correctly, and refresh the div to show the button in State B.
• When I click on the button when it is in State B, it will post correctly, and refresh the div (according to Chrome Dev Tools), but the button remains in State B. Upon actual browser refresh, the button will appear in the correct State.

The two States and their respective post files are almost identical except for the minor necessary differences (one adds to a database table, one deletes from a database table). Seeing as the button correctly changes from State A to State B, but not the reverse, I'm not sure where the problem lies. To complicate things, a browser refresh will reveal the button in the correct state. $.load() is being used by myself to simulate a browser refresh of only one div element, for usability purposes and to cut down on loads. Therefore, I can only assume it is an error of the $.load() method.

Here's the jQuery code that controls the butt开发者_如何转开发on click handling of both State A and State B:

     //State A
     $('#subButton').live('click',function() {
        $.post("php/retailerNameNotif.php", $("#retailerNameNotif").serialize(), function(){
            $('#retailerNameSubDiv').load('coupon.php #retailerNameSubDiv', function(){$( "button, input:submit, input:button, a#jql, input:radio" ).button();});  
        });            
    });

    //State B
    $('#unsubButton').live('click',function() {
        $.post("php/retailerNameNotifUnsub.php", $("#retailerNameNotifUnsub").serialize(), function(){ 
            $('#retailerNameSubDiv').load('coupon.php #retailerNameSubDiv', function(){$( "button, input:submit, input:button, a#jql, input:radio" ).button();});      
        });      
    });

Any help?

Edit: As a further complication, I've noticed that occasionally, it will work correctly, switching states exactly as I want. However, on the 6th (and consistently the 6th) time, it goes back to the behavior I described here, getting stuck on one of the States.

---

My guess would be that the browser is caching the results of the load() call. You could try inserting a random string to the filename to be sure that the request is made every time.

For example (not tested) :

var rnd = Math.random()
$('#retailerNameSubDiv').load('coupon.php?rnd=' + rnd + ' #retailerNameSubDiv', function(){$( "button, input:submit, input:button, a#jql, input:radio" ).button();});