Javascript 切换列表，h4标题更改为默认值<；李>；

早餐，一开始是

h4

，最后是与

li

元素相同的样式，我只是想知道如何将它保持为

h4

。 谢谢

HTML

<div class="recipe">
  <h4>Breakfast</h4>
</div>
<div class="content">
  <ul>
    <li>Banana Berry Crepes - 250 Cals</li>
    <li>Strawberry Parfaits - 170 Cals</li>
  </ul>
</div>

Javascript

$(document).ready(function(){

$(".recipe").click(function () {

    $recipe = $(this);
    $content = $recipe.next();
    $content.slideToggle(500, function () {
        $recipe.text(function () {
            return $content.is(":visible") ? "Breakfast" : "Breakfast";
        });
    });

});

});

检查小提琴

我已经改变了你的JS代码如下

$recipe.children('h4').text(function () {
        return $content.is(":visible") ? "Breakfast" : "Breakfast";
    });

希望这回答了你的问题：）

$recipe.children('h4').text(function () {
        return $content.is(":visible") ? "Breakfast" : "Breakfast";
    });