Jquery - 空であればdivを非表示にする

Question

div要素が空であれば非表示にするにはどうすればいいですか？

HTML構造は：

<div class="row"> 
    <div class="col-md-5"> 
     <div class="left-col"></div> 
    </div> 
    <div class="col-md-7"> 
     <div class="right-col"></div> 
    </div> 
</div> 

私はいつも左-COLは文句を言わない空であることを知っているが、右colがあるかもしれません。空の場合は、行全体を非表示にしたい。

私は以下のことを試しましたが、変更はありませんでした。

$(document).ready(function() { 
     $('right-col:empty').hide(); 
}); 

Answer 1

あなたはクラスセレクタで.、すなわち

変更も含まれていない：あなたはとても.を使用するクラスを使用している

$('.right-col:empty').hide(); 

Answer 2

に

$('right-col:empty').hide(); 

を。

$(document).ready(function() { 
 
    $('.right-col:empty').hide(); 
 
});

.right-col 
 
{ 
 
    background-color: lightblue; 
 
    height: 200px; 
 
    width: 50%; 
 
} 
 
.left-col 
 
{ 
 
    background-color: red; 
 
    height: 200px; 
 
    width: 50%; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="row"> 
 
    <div class="col-md-5"> 
 
     <div class="left-col"></div> 
 
    </div> 
 
    <div class="col-md-7"> 
 
     <div class="right-col"></div> 
 
    </div> 
 
</div>

Answer 3

あなたが行全体を非表示にする場合は、あなただけright-colを非表示にしたい場合は、あなたは、

$('.right-col:empty').parent().parent().hide(); 

または

$('.right-col:empty').closest('.row').hide(); 

を試してみてください唯一のCSSを使用してそれを行うことができます：

.right-col:empty { 
    display: none; 
}