使用jquery .on（）和$ .ajax

I have buttons that will be repeatedly destroyed and re-rendered. I am trying to use .on() to do this, as it works for elements not yet created. I suspect the syntax is correct, jslint finds no errors. It breaks some of the javascript on the page, but not all of it. I've never used .on(). I'm unsure why it shows no errors on jslint, but breaks some of my browser, and why it only breaks some of my browser.

Here is my jQuery. In this case, #showPrevious is what is being destroyed and re-rendered.

$("#showPrevious").on( "click", function(){
    $.ajax({
        url: "flip/showprevious.php",
        cache: false,
        success: function(html){        
            $("#showContainer").html(html);             
        }
    });
});

From the jQuery documentation on delegated events

Event handlers are bound only to the currently selected elements; they must exist on the page at the time your code makes the call to .on()

To do something like this, you attach the event handler on a parent element to the element being added/removed.

For example:

$( "#aParentSelector" ).on( "click", "#showPrevious", function() {
  // $.ajax({ ... }) etc
});