Search code examples
javascriptjquery

jquery simplify statements


Say I have the following, is there a way to chain them together, or simplify them in an way?

var initialTab = $('#navigation li#red');
initialTab.siblings().removeClass('on').find('ul').fadeOut(1000);
initialTab.addClass('on').find('ul').fadeIn(1000);

Thanks


Solution

  • You can chain it, like this:

    $('#red').addClass('on').find('ul').fadeIn(1000)
       .end().siblings().removeClass('on').find('ul').fadeOut(1000);
    

    An ID must be unique, so just #red will suffice here, and though .find() takes the chain the the <ul> descendants, .end() takes it back to the #red element so we can use .siblings() on that.