jquery - jQueryでクラスの次の要素を選択

Question

これを簡単にするために、2 つの「Featured」ブロックがあり、最初のブロックはクラスfeatures-activeが適用された状態でロードされます。

features-activeタイマー (jQuery 内) の後、最初の要素からクラスを削除し、クラスの次のブロックに適用したいと思います.features。

ここに私のHTMLがあります：

<!-- Feature 1 -->

<div class="span3">
  <div class="features drop-shadow features-active">
    <h4><strong>SUPER</strong> RESPONSIVE</h4>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua Lorem ipsum dolor sit amet...</p>
  </div>
</div>

<!-- Feature 2 -->

<div class="span3">
  <div class="features drop-shadow">
    <h4><strong>SUPER</strong> RESPONSIVE</h4>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua Lorem ipsum dolor sit amet...</p>
  </div>
</div>

私の唯一の質問 (今日は気が進まない) は、タイマーが作動した.features後、次の要素を選択するにはどうすればよいdiv.features-activeですか?

動作しない私のjQueryは次のとおりです。

var nextFeature = $('div.features-active').next('div.features');

Answer 1

.next()ノードの親に適用する必要があります。

var nextFeature = $('div.features-active').parent('div.span3')
                                          .next('div.span3')
                                          .children('div.features');

Answer 2

.next()、.parent()、.children()、.find() などを使用してオーバーヘッドを浪費する代わりに、注目の要素のインデックスを使用するだけです。

var idx = 1;
setInterval(function () {
    $('div.features').removeClass('features-active');
    $('div.features').eq(idx).addClass('features-active');
    idx++;
}, 2000);

jsFiddle の例

Answer 3

次はありません.features、彼らは別の親を持っていますか？

var nextFeature = $('div.features-active').closest('.span3')
                                          .next('.span3')
                                          .find('div.features')

Answer 4

私はあなたがこれを探していると思います：http：//jsfiddle.net/umTPw/

setTimeout(function () {
   $('.features').removeClass('features-active').promise().done(function () {
      $(this).parent().next().find('.features').addClass('features-active');
   });
}, 2000);

Answer 5

これはどう：

var nextFeature = $('div.features-active').next().find('div.features');