jQuery load（）之后，jQuery单击处理程序不起作用

Question

I have written a click function on the HTML page for DIV elements. But after using jQuery load(), that click function for the DIV elements does not work. For example:

$(".about .visible").click(function () {
$("form").toggleSlide();
});

<div class="mypro"> 
<div class="about">
<div class="visible"></div>
here is my text
</div>
</div>

If I use:

$(".mypro").load("get.php");

Actually this is the original code:

$('.cv-right .cv-right-content .about').on({
mouseenter: function (a) {
     $(this).find('.about .visible').show();
},
mouseleave: function (a) {
    $(this).find('.about .visible').hide();
}

});

Then, jQuery code for .about .visible click will not work. How can I solve this problem?

Answer 1

You should delegate event to handle dynamic elements:

$(".mypro").on("click", ".about .visible", function () {
    $("form").toggleSlide();
});