jquery - FadeTo いくつかの異なる画像

Question

私は Web デザインと JQuery に非常に慣れていないため、クリックするとそれぞれ異なるテキスト ボックスが表示される 13 の異なる画像で FadeTo を使用しようとしています。たとえば、「ピンホール」と呼ばれる写真はピンホール カメラの作成に関するテキストを表示し、「オブスキュラ」と呼ばれる写真はカメラ オブスクラに関するテキストを表示します。

どういうわけか、私はそれを機能させることができません。さまざまなことを試しましたが、すべてが同時にフェードするか、現在のように機能しないか、エラー メッセージが表示されます。これが私の試みです：

$(document).ready(function(){

$('#pinhole, #obscura, #heliography, #daguerreotype, #calotype, #wetc, #drygel, #kodak1, #leica2, #polaroid, #dslr, #cellphone, #future').click(function(){

    $(pinhole).fadeTo('slow',0.5);
    }, function(){
    $(pinholeText).stop().fadeTo('slow',1);
    }
    );

    $(obscura).fadeTo('slow',0.5);
    }, function(){
    $(obscuraText).stop().fadeTo('slow',1);
    }
    );

    $(heliography).fadeTo('slow',0.5);
    }, function(){
    $(heliographyText).stop().fadeTo('slow',1);
    }
    );

    $(daguerreotype).fadeTo('slow',0.5);
    }, function(){
    $(daguerreotypeText).stop().fadeTo('slow',1);
    }
    );

    $(calotype).fadeTo('slow',0.5);
    }, function(){
    $(calotypeText).stop().fadeTo('slow',1);
    }
    );

    $(wetc).fadeTo('slow',0.5);
    }, function(){
    $(wetcText).stop().fadeTo('slow',1);
    }
    );

    $(drygel).fadeTo('slow',0.5);
    }, function(){
    $(drygelText).stop().fadeTo('slow',1);
    }
    );

    $(kodak1).fadeTo('slow',0.5);
    }, function(){
    $(kodak1Text).stop().fadeTo('slow',1);
    }
    );

    $(leica2).fadeTo('slow',0.5);
    }, function(){
    $(leica2Text).stop().fadeTo('slow',1);
    }
    );

    $(polaroid).fadeTo('slow',0.5);
    }, function(){
    $(polaroidText).stop().fadeTo('slow',1);
    }
    );

    $(dslr).fadeTo('slow',0.5);
    }, function(){
    $(dslrText).stop().fadeTo('slow',1);
    }
    );

    $(cellphone).fadeTo('slow',0.5);
    }, function(){
    $(cellphoneText).stop().fadeTo('slow',1);
    }
    );

    $(future).fadeTo('slow',0.5);
    }, function(){
    $(futureText).stop().fadeTo('slow',1);
    }
    );

});

いくつかのチュートリアルを試しましたが、どれもうまくいきませんでした。誰かヒントを教えてください。それは非常にありがたいです！