().next()

대상이되는 Element를 기준으로 다음에 인접한 Element를 찾는다.

Ex) FAQ Toggle.

<div id="main">

    <h2>질문1</h2>
    <div class="answer">답변1</div>
    <h2>질문2</h2>
    <div class="answer">답변2</div>
</div>

jQuery

$(document).ready(function( ) {

 $('.answer').hide(); //답변부를 닫아놓는다. css에서 제어해도 되나 javascript 미지원 환경에서의 작동을 고려함.

$('#main h2').toggle(function(){  // main 이란 ID 를 지닌 하위의 h2 에 toggle 기능을 부여

$(this).next('.answer').fadeIn(); // main h2 다음에 있는 answer라는 class를 faidin 시킨다.

}, // 기능추가

function(){

$(this).next('.answer').fadeOut(); //main h2 다음에 있는 answer라는 class를 faidOut 시킨다.

});

});

toggle 의 기능을 활용하기 위해 fadein 과 fadeout 의 두 기능을 사용