Code is here:-

{% csrf_token %}

//Your string

let a = "{{models}}"
a = a.replace(/"/g, '"');
a = a.replace(/(?:\r\n|\r|\n)/g, '');

let stringToParse = JSON.stringify(a);
//document.body.innerHTML = `<p> Received String: ${stringToParse}</p>`;

//Converting your string to object
let convertedToObject = JSON.parse(stringToParse);
document.body.innerHTML = `<p> Received String: ${convertedToObject}</p>`;

//Getting the boardMembers list from your parsed object
let listBoardMembers = convertedToObject.boardMembers;
let listExecutives = convertedToObjects.executives;

document.body.innerHTML = `<p> listboard: ${listBoardMembers}</p>`;
document.body.innerHTML = `<p> listexecutives: ${listExecutives}</p>`;

//Creating Elements on HTML (creating a Paragraph with the received data and a container for the list of members). *Notice: I've created a "DIV" (container) with a unique ID ("listMembers"). This is important because when I start to iterate the members I will add them inside the container, and for that, I need to reference it using an ID.*

//document.body.innerHTML = `<p> Received String: ${convertedToObject}</p>`;
document.body.innerHTML += `<div id="listMembers"></div>`;

//Iterating the list of boardMembers using this length;
for (let i = 0; i < listBoardMembers.length; i++) {
let member = listOfMembers[i];

let memberName = member.name;
let memberImageURL = '';

// Verify if the user has thumbnail
if (member.thumbnail !== null){
memberImageURL = member.thumbnail.url;
}

//Adding this member to the member's container, using the container ID, that we created previously.

document.getElementById('listMembers').innerHTML += `
<div style="display: flex;">
<img src="${memberImageURL}">
<h1>${memberName}</h1>
</div>
`;
}

JSON object is here:-

{"boardMembers": [{"id": "7394026", "name": "Stephen Joseph Squeri", "slug": "7394026-stephen-joseph-squeri", "companyName": "American Express Co", "company": {"id": "AXP:US", "name": "American Express Co"}, "webVisibility": true}, {"id": "3994082", "name": "Ronald A Williams "Ron"", "slug": "3994082-ronald-a-williams-"ron"", "companyName": null, "company": null, "webVisibility": false}, {"id": "1439479", "name": "Theodore J. Leonsis", "slug": "1439479-theodore-j-leonsis", "companyName": "