jQuery: $('this') ではなく $(this)

昔やらかして数十分を無駄にしてしまった記述ミスを紹介します。
次のように、複数の要素の１つをクリックしたときに、 クリックされた要素に対して何かしらの処理をする、というロジックです。 jQeuryの記述部分で間違いを探してください。

HTML

<ul>
    <li><a href=""></a>リストA</li>
    <li><a href=""></a>リストB</li>
    <li><a href=""></a>リストC</li>
</ul>
JavaScript

$('li').on('click', function(){
    $('this').css('color', 'red');
});

ページのタイトルからもわかるように、$('this')とやらかしてしまっています。

jQueryを使用する場合は、ほとんどのケースでシングル（又はダブル）クォーテーションで囲みます。 $('li')、$('.classname')、$('#idName')というような記述になります。

それに引っ張られてthisを使用するときにも$('this')と無意識にシングルクォーテーションを付けてしまい、 該当要素が正常に取得できないというエラーにはまること数十分。 原因に気づいたときは思わず笑ってしまいました。

注意事項: $('this') ではなく $(this)

jQuery入門