My append() is double appending?

Question

$('.photoSaved').click(function () {
    var savedPhoto = $(this).attr('id');
    // create image and append the html inside <div id=#image>
    $("#image").append("LOL").show();
});

Why does this turn out as "LOLLOL" ?

I have looked for #image anywhere in my file. #image gets used by another function too, but that doesnt execute if you dont click a button. I even commented it so it has no function, and still I get "LOLLOL"

#image is just a normal <div id="image" style="display:none;"></div>

What could it be?

Answer 1

You're not calling event.stopPropagation() from your onclick handler. Maybe the element you're clicking has an ancestor which also has the photoSaved class, and the click event bubbles up to that ancestor, so your handler indeed runs twice.

Answer 2

He rewrote the code based on feedback in chat.stackoverflow.com and after a thorough rewrite he's back up and running the way he needs to be.