A quantidade do produto não está sendo atualizada na tela.

Olá pessoa! Eu implementei a requisição assíncrona com Ajax , JQuery, mas a quantidade do produto na tela não é decrementada. A propriedade quantidade do objeto é atualizada, mas não foi possível reproduzir isso para a tela. Estou usando o navegador Microsoft Edge.

Segue o código implementado:

1- View
<script type="text/javascript" src="~/Scripts/jquery-1.10.2.js"></script>
<script type="text/javascript">
    function decrementa(produtoId)
    {
        var url = "@Url.Action("DecrementaQtd", "Produto")";
        var params = { id: produtoId };
        $.post(url, params, atualiza);
    }
    function atualiza(resposta)
    {
        var elemento = $("#quantidade" + resposta.id);
        elemento.html(resposta.Quantidade);
    }
</script>

@model IList<CaelumEstoque.Models.Produto>
<table class="table table-hover">
    <thead>
        <tr>
            <th>Id</th>
            <th>Nome do Produto</th>
            <th>Quantidade</th>
        </tr>
    </thead>
    <tbody>
        @foreach (var produto in Model)
        {
            <tr>
                <td>@produto.Id</td>
                <td>
                    @Html.RouteLink(produto.Nome, "VisualizaProduto", new { id = produto.Id })
                </td>
                @*<td>@Html.ActionLink(produto.Nome, "Visualiza", new { id = produto.Id })</td>*@
                <td id="quantidade@(produto.Id)">@produto.Quantidade</td>
                <td><a href="#" onclick="decrementa(@produto.Id)">Decrementar</a></td>
            </tr>
        }
    </tbody>
</table>


2 - Controller 

 public ActionResult DecrementaQtd(int id)
        {
            ProdutosDAO dao = new ProdutosDAO();
            Produto produto = dao.BuscaPorId(id);
            produto.Quantidade--;
            dao.Atualiza(produto);
            return Json(produto);
        }