Intentando ocultar () un elemento con jQuery

Tengo un código que hace esto:

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

Esto genera una superposición modal y muestra un img dentro de un div con la clase .gall-output. He creado un pequeño<p class="gall-close">close</p>&nbsp;ahide()&nbsp;el.gall-output&nbsp;pero no parece estar funcionando con este código:

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

¿Hay alguna manera de usar este .gall-close para ocultar o alternar .gall-output?

Gracias por tu ayuda.