Chciałabym, aby po najechaniu na tekst zmienił się kolor tej linijki, w której znajduje się tekst, nie całego tła. Musi być wykorzystana biblioteka jQuery. Napisałam taki kod, jednak nie działa, tekst się pojawia, ale nie zmienia się kolor. Gdzie jest błąd? Dopiero zaczynam z jQuery i jeszcze ciężko mi wyłapać wszystkie błędy.
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
<script src="https://code.jquery.com/jquery=3.6.0.min.js"></script>
<title>Document</title>
</head>
<body>
<div>
<p>To jest pierwszy akapit</p>
<p>To jest drugi akapit</p>
<p>To jest trzeci akapit</p>
<script>
$("p").on({
"mouseover" : function(){
$(this).css("background-color", "yellow");
},
"mouseout" : function(){
$(this).css("background-color", "white");
}
});
</script>
</div>
</body>
</html>