jquery - .activeクラスの場合、JQueryが背景画像を削除しない

Question

背景画像を削除しないjqueryに問題があります。

私はディープリンクでZurbのFoundationフレームワークを使用しており、この形式のコードをいくつか持っています（HTMLのかなりの部分を切り出しました）：

<div id="contentWrap">
  <section id="one" class="mixed">
    <a href="#">One</a>
    <div class="content"></div>
  </section>   
  <section id="two" class="mixed active">
    <a href="#">One</a>
    <div class="content"></div>
  </section>
</div>

css を使用して #contentWrap 背景画像を設定していますが、最初のリンクがアクティブなときにのみ画像を表示したいと考えています。

私はこのJQueryコードを使用しています:

// Add background image if #one clicked
$('#one a').click(function(){
  $("#contentWrap").css("background-image","url('xx.jpg')");
});

// Remove background image if #two clicked
$('#two a').click(function(){
  $("#contentWrap").css("background-image","none");
});

// Remove background image if #two has class of .active
if ( $("#two").hasClass("active") ) {
  $("#contentWrap").css("background-image","none")
};

ディープリンク (つまり、xx.com/#two) によって 2 番目のタブがアクティブな状態でページが読み込まれる場合、背景画像は引き続き読み込まれます。

私はこれを機能させていましたが、コードが（ワードプレス）サイトにロードされる方法にいくつかの更新を行い、現在jQuery(document).ready(function($)は他のすべてのJS（機能している）をラップするために使用しています。

どんな助けでも大歓迎です。