Скрыть div, если тег заголовка внутри него пуст?

Question

У меня есть карусель, где я пытаюсь скрыть описание некоторых слайдов, если контент не выводится динамически.

Моя структура с содержанием выводимого:

<div class="caption"> 
    <h3><a>title</a></h3> 
    <p><a>description</a></p> 
</div> 

Моя структура без:

<div class="caption"> 
    <h3><a></a></h3> 
    <p><a></a></p> 
</div> 

Javascript:

if($.trim($('.caption h3 a').text()) != "") { 
$(".carousel-caption.h").addClass("visible"); 
} 

Я получил JavaScript с просматривал подобные вопросы на здесь. Я пробовал разные способы сделать это, но безрезультатно. Я не совсем уверен, чего не хватает?

Answer 1

Вы можете сделать это, чтобы скрыть все .caption имея пустой заголовок:

$('.caption').show().filter(function(){ 
    return $.trim($('h3', this).text())==='' 
}).hide(); 

Это может быть ближе от вашего исходного раствора, меняя только класс, когда головка имеет содержание:

$('.caption').each(function(){ 
    if ($.trim($('h3', this).text())!=='') $(this).addClass('visible'); 
}); 

Answer 2

Я не парень jQuery. Но в YUI это может быть просто нравится:

if (Y.one(".caption h3 a").get("innerHTML") == "") { 
    alert("its empty"); 
} 

попробуйте использовать .html вместо .text в JQuery

Answer 3

это работает,

if($('.caption h3 a').text().trim() != "") { 
     $(".carousel-caption.h").addClass("visible"); 
} 

FIDDLE