Установка значения по умолчанию в раскрывающемся списке после изменения элемента jQuery

Question

Я заранее прошу прощения, если этот вопрос / вопрос был поднят или задан. Я не нашел ни одного этого типа.

При нажатии кнопки я хотел бы изменить поле данных в раскрывающийся список, который по умолчанию соответствует значению, которое присутствовало до изменения.

$("#edit").on("click", function() {
  let food = $("#food");
  let foodValue = food.attr("data-food-value");

  food.html(`<select>
                     <option value="1">Fries</option>
                     <option value="2">Burger</option>
                     <option value="3">Pizza</option>
                  </select>`);

  $(`#food select option[value="${foodValue}"]`).attr("selected", true);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <th>Favorite Food</th>
      <td id="food" data-food-value="3">Pizza</td>
    </tr>
    <tbody>
</table>

<button id="edit">Edit</button>

Я хочу, чтобы по умолчанию это была Пицца при нажатии кнопки, но по умолчанию это Фри. Любая помощь очень ценится. Заранее спасибо.