Search code examples
javascriptjquerylive

Jquery - click on element generated by jquery function


I have a jquery slider (nivo slider) that generates the next and prev button with jquery. I'm trying to add a hide() action for a div on that buttons.

$(document).ready(function(){
   $(".nivo-prevNav").live('click', function() {
      $("#slide3").hide();
   });
});

.nivo-prevNav class is generated by the jquery function of slider

Any ideas on how I can fix this because it is not working


Solution

  • .live() has been deprecated. Use .on() instead:

    $(document).on("click", ".nivo-prevNav", function() {
         $("#slide3").hide();
    });
    

    For better performance, you should call .on() on the closest parent that's available before the Nivo plugin runs:

    $("#nivo-wrapper").on("click", ".nivo-prevNav", function() {
         $("#slide3").hide();
    });
    

    You should change #nivo-wrapper to whatever element you're calling the Nivo Slider on.