javascript – Iterating over the data received from ajax / json

Below is the type of data I am getting via ajax.

[{"model": "blogapp.articles", "pk": 1, "fields": {"title": "Rainbow Buildings in Tokyo", "slug": "Rainbow-Buildings-in-Tokyo"}}, {"model": "blogapp.articles", "pk": 2, "fields": {"title": "4 Cool Cube Facades", "slug": "4-Cool-Cube-Facades"}}]

How can I iterate over this data using .each to get the title and the slug for each entry?

The below code gives me a syntax error on the data.

app.js

$(document).ready(function () {
  $(".tag-nav-links").on("click", function (e) {
    e.stopPropagation();
    return $.ajax({
      type: "POST",
      url: "",
      dataType: "json",
      data: { filter: `${e.target.textContent}` },
      success: function (data) {
        var html = "";
        $(data).each(function (index, value) {
          html += "<h4>{{" + value.title + "}}</h4>";
        });
        $("trial").append(html);
      },
    });
  });
});