'Uncaught TypeError：vairable.fadeOutはforループの関数ではありません

Question

クラス名を変数に設定してからfadeOut（）を設定しようとしています。私はfadeOut（）をクエリセレクタで直接使用できますが、変数に格納するときは使用できません。ここで

var sections = ["$('.start')", "$('.one')", "$('.two')", "$('.three')", "$('.four')", "$('.five')", "$('.six')","$('.seven')","$('.eight')"]; 
var begin = $('.begin'); 

var i = 0; 
var currentSection = sections[i]; 
var nextSection; 

begin.on('click', function(){ 
    for(i=0; i < sections.length; i++){ 
    console.log(currentSection); 
    currentSection.fadeOut(); 
    currentSection = sections[i+1]; 
    } 
}); 

まで何示す無音とビデオだ：

は、ここに私のコードですhttp://screencast-o-matic.com/watch/cbj3rvl8YF

が、私は何かが足りないのですか？

は、ここでは、コードの残りのための私のCodePenへのリンクです：https://codepen.io/naturalhanglider/collab/bd90327af7cb6da2620e3a3c4d7f398f/?editors=1010

私の周り掘って、私が探していたものを見つけることができませんでした。この質問が以前に聞かれた場合は、正しい方向に私を指摘してください！

Answer 1

このようにします。最初に私はあなたが私は任意のHTMLを参照してくださいカント原因フェードするtryinngされているものを知らないこの

var sections = [$('.start'), $('.one'), $('.two'), $('.three'), $('.four'), $('.five'), $('.six'),$('.seven'),$('.eight')]; 
var begin = $('.begin'); 

var i = 0; 

begin.on('click', function(){ 
    for(i=0; i < sections.length; i++){ 
    console.log(currentSection); 
    var currentSection = $("#section-"+i); 
    currentSection.fadeOut(); 
    } 
}); 

のようにそれらを取得foorループでこの

<section class="start"> 
    <p><div class="begin button">Begin</div></p> 
</section> 
<section id="section-1" class="one hidden"> 
<div class="bg"> 
<p class="overlay">Section One</p> 
</div> 
</section> 
<section id="section-2" class="two hidden"> 
<p>Section Two</p> 
</section> 
<section id="section-2" class="three hidden"> 
<p>Section Three</p> 
</section> 
<section id="section-4" class="four hidden"> 
<p>Section Four</p> 
</section> 
<section id="section-5" class="five hidden"> 
    <p>Section Five</p> 
</section> 
<section id="section-6" class="six hidden"> 
    <p>Section Six</p> 
</section> 
<section id="section-7" class="seven hidden"> 
<p>Section Seven</p> 
</section> 
<section id="section-8" class="eight hidden"> 
<p>Section Eight</p> 
</section> 

とあなたのjavascriptのコードのようなあなたのhtmlに固有のIDを追加あなたのエラーはこれを行うことによって再び発生しません。

か、また、この

begin.on('click', function(){ 
    sections.forEach(function(element) { 
    console.log(element); 
    element.fadeOut(); 
    console.log(element); 

}のように行うことができます）。