Trying to hide() an element with jQuery

Question

I have code that does this:

$('.attachment-medium').each(function(){
$(this).click(function(){
    var gallWidth = $('.gallery').width();
    $('.gall-output').toggle().css('width', gallWidth);
    var url = $(this).attr('src').slice(0,-12) + '.jpg';
    $('.gall-output-img').html('<img class="img-responsive" src="' + url + ' "/>');
    var imgMeta = $(this).parent().next().html();
    $('#gall-output-meta').html(imgMeta);
});
});

This generates a modal overlay and displays an img withing a div with class .gall-output. I've created a small <p class="gall-close">close</p> to hide() the .gall-output but it doesn't seem to be working with this code:

$('.gall-close').click(function() {
    $('.gall-output').hide();
});

Is there a way of using this .gall-close to hide or toggle .gall-output?

Thanks for your help.

We will need to see your HTML. More than likely this is happening because JQuery cannot traverse to the .gall-output element based on your click. — EternalHour
– EternalHour, Commented Oct 5, 2014 at 9:07

matthias_h · Accepted Answer · 2014-10-05 09:04:24Z

1

In case the .gall-close is added later and not in the dom when the page is loaded, you can attach the click-event using event-delegation:

$(document).on("click", ".gall-close", function(){
    $('.gall-output').hide();
});

Instead of $(document) any static parent element can work as container element to delegate the event. In case this solves your issue, you can check https://api.jquery.com/on/#on-events-selector-data-handler, section "Direct and delegated events":

"Event handlers are bound only to the currently selected elements; they must exist on the page at the time your code makes the call to .on()."

answered Oct 5, 2014 at 9:04

matthias_h

11.4k9 gold badges24 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Trying to hide() an element with jQuery

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related