【jQuery】 $(this)の親要素、子要素、隣接要素を指定

$(this)はjQueryでイベントが発生した要素を指定することができます。

.click(function()などで、ボタンのクラス名を.btn-01や.btn-02と別々に分けなくても、イベントが発生した要素を指定できるので、
jsのコードなどきれいにまとめたりできます。

$(“.btn-01”).click(function(){
     $(".btn-01").find(div).css("display","block")
});
$(“.btn-02”).click(function(){
     $(".btn-01").find(div).css("display","block")
});

上記のようにボタンごとにクリックファンクションを指定しなくても

class=”btn”に対して押されたボタンの子要素を判別して、処理を行ってくれるので、ソースもきれいにまとめることができます。

$(“.btn”).click(function(){
     $(this).children("div").css("display","block")
});