Search code examples
javascriptjqueryhtmljquery-load

using .load() then JQuery code not recognized


I tried using this simple implementation to replace an image by any selected image from a gallery of thumbnails. The problem comes in when I use the .load() function and replace my current div class named "replace" with a new div such as NYC with a gallery from there. After the gallery is replaced, the first function no longer works.

<script>
    $('.replace #thumbs img').click(function(){ 
        $('#largeImage').attr('src',$(this).attr('src').replace('thumb', 'large'));
    });
</script>




<script>
    $(document).ready(function() {
        $( ".NYC" ).click(function() {
            $(".replace").load("Galleries.html #NYC");
        });
    });
</script>

Solution

  • use jquery on to register your first click such as:

    <script>
        $('.replace').on('click', '#thumbs img', function(){ 
            $('#largeImage').attr('src',$(this).attr('src').replace('thumb', 'large'));
        });
    </script>