javascript - 何も表示されない

Question

私はこれをやろうとしています：

ショッピング カートが空の場合、その上に別の div が表示されます。したがって、カートは表示されませんが、「カートは空です」という div が表示されます

css で他の div を display:none に設定していますが、常に表示されています。JavaScriptを使用して非表示または表示しようとしています。私が使用しているカートはsimplecart jsです。

カートとカートの空の div の CSS はこちら

.cart{
margin: 30px 0 0 0;
background:red;
position:relative;
}
#if-cart-empty{
position:absolute;
top:0;
bottom:0;
left:0;
right:0;
display: none;
background:w

これはhtmlです

<div class="cart">',
<div class="simpleCart_items"></div>',
<span class="simpleCart_quantity"></span> items - <span class="simpleCart_total"></span>',
<div class="checkout">',
<a href="javascript:;" class="simpleCart_checkout">Checkout</a>',
</div>',
<a href="javascript:;" class="simpleCart_empty">Empty Basket</a>',
<div id="if-cart-empty" style="display: none">Your cart is empty.</div>',
</div>',

そして、これはjsです

checkCart();
$('.itemremove').click(function(){    
$('.itemContainer').remove();  
checkCart();
});

function checkCart(){
var item = $('.itemRow');
if (item.length > 0) {
$('#if-cart-empty').hide();
} else {
$('#if-cart-empty').show();
}
}

誰でもこれを機能させるのを手伝ってもらえますか? ありがとう