使用Javascript切换文字颜色

Question

我正在用来自JSON文件的输入来在php中创建菜单。 我遇到的问题是，一旦他们单击div类“菜单项”中的任意位置，我希望标题将颜色更改为绿色。 颜色变为绿色后，我还希望他们能够单击它并使它恢复到原始状态。 我了解我需要为此选项使用JavaScript或Jquery，但在任何文档中都找不到。 我觉得我缺少了一些小东西，看上去到处都是，但还没弄清楚。 任何帮助表示赞赏。

    foreach ($obj as $menu_item) {
      echo '<div class="menu-item">';
      echo '<img class="food-item" src="'.$menu_item->{'image-url'}.'"><br/>';
      echo '<p class="title" onclick="changeColor("title"); return false;">'.$menu_item->name.'</p><br/>';
      echo '$'.$menu_item->price.'<br/>';
      echo $menu_item->Description.'<br/>';
      echo '</div>';
    }

Answer 1

jQuery切换将为您完成，请参见小提琴： https : //jsfiddle.net/c259LrpL/24/

  $(".menu-item").click(function() {
    $(this).toggleClass("red");
  });

CSS范例：

.menu-item {
  background-color: blue;
  color: white;
}

.menu-item.red {
  background-color: red;
  color: blue;
}