jQueryのセレクタでcssの:hover状態を定義するには？

質問

jQueryでdivの:hover時の背景色を定義したいのですが、下記ではうまくいかないようです。

$(".myclass:hover div").css("background-color","red");

どうしたら同じ結果になるのでしょうか？jQueryで行わなければならないことが重要なのですが、なぜかうまくいきません。何か提案はありますか？ありがとうございます！

どのように解決するには？

jqueryよりもCSSを使うことをお勧めします（可能であれば）そうでなければ、次のようなものを使うことができます。

$("div.myclass").hover(function() {
  $(this).css("background-color","red")
});

セレクタは必要に応じて変更してください。

A.Wolffさんのコメントにあるように、このホバー効果を複数のクラスで使いたい場合は、以下のようにします。

$(".myclass, .myclass2").hover(function(e) { 
    $(this).css("background-color",e.type === "mouseenter"?"red":"transparent") 
})

Jsフィドルデモ