Eu tenho um código que faz isso:

$('.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);
});
});

Isso gera uma sobreposição modal e exibe um img dentro de uma div com a classe .gall-output. Eu criei um pequeno<p class="gall-close">close</p> parahide() a.gall-output mas parece não estar funcionando com este código:

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

Existe uma maneira de usar esse .gall-close para ocultar ou alternar .gall-output?

Obrigado pela ajuda.