如何在“添加到购物车”旁边添加“添加到愿望列表”按钮？

<button id="wishlist-btn">添加到愿望列表</button>

#wishlist-btn {
  background-color: #f2f2f2;
  border: 1px solid #ccc;
  color: #333;
  padding: 5px 10px;
  font-size: 14px;
}

var wishlistBtn = document.getElementById('wishlist-btn');
wishlistBtn.addEventListener('click', addToWishlist);

function addToWishlist() {
  // 执行添加到愿望列表的操作
  // 可以通过发送请求到后端或者执行其他相关操作
  // 示例：向后端发送POST请求
  fetch('/api/add-to-wishlist', {
    method: 'POST',
    body: JSON.stringify({ productId: '123' }),
    headers: {
      'Content-Type': 'application/json'
    }
  })
  .then(function(response) {
    // 处理响应结果
    if (response.ok) {
      alert('已成功添加到愿望列表！');
    } else {
      alert('添加到愿望列表失败，请重试！');
    }
  })
  .catch(function(error) {
    console.log('请求出错:', error);
  });
}