CODEWITHSUNDEEP
jqueryajax
user1260074
user1260074

Reputation: 55

jQuery Functions not Working After Using .load() to Refresh div Content

I'm reloading the contents of "#some-div" using ".load()" after processing some form data. This works just fine and "#some-div" is refreshed with the expected updated content. The problem is that none of my other assigned jQuery functions (e.g. ".some-trigger" below) will work for elements within "#some-div" after it has been refreshed. Any insight is much appreciated. Here's a simplified representation of my code.

<div id="some-div">
    <a class="some-trigger" href="#">I Won't Work Anymore After I've Been Refreshed</a>
</div>

<script> 
    $('.ajax-form').ajaxForm(function() {  
        $("#some-div").load(location.href+" #some-div>*","");
    });

    $('.some-trigger').someFunction();
</script>

Upvotes: 2

Views: 1044

Answers (1)

Ram
Ram

Reputation: 144659

you should delegate the click event for dynamically loaded elements, try the following:

$("#some-div").on('click', '.some-trigger', function() {
   // do something here
})

Upvotes: 1

Related Questions