How can I Select an Element after appendTo

Question

I have an empty div, like this:

<div class="albums"></div>

When user login in I call getPhotos(); function, and this function add some data inside albums div, like this:

$('<div class="photo"><img class="photoimg" src="IMG" ></div>').appendTo($('.albums'));

adding data successfull.

I see images but I think jQuery doesnt see.

I cant select images.

$('.photoimg').click(function(){
        alert();
});

any other solution?

Answer 1

You can use event delegation like this

$('<div class="photo"><img class="photoimg" src="IMG" ></div>').appendTo($('.albums'));

$('.albums').on('click', '.photoimg', function () {
  console.log(this);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="albums"></div>

Answer 2

These are dynamic elements. So you need to delegate the events. Use event delegation this way:

$('.albums').on('click', '.photoimg', function() {
  // your code
});