Jquery - click on element generated by jquery function

Question

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

Answer 1

.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.

Answer 2

Are you getting any JavaScript errors?

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

Change "live" to "on". Live is depreciated in the newest version of jQuery.