Изменение модальных результатов на основе нажатия кнопки

#javascript #jquery

Вопрос:

Поэтому у меня есть функция, которая возвращает названия аниме с небольшими деталями, используя API JIKAN. В принципе, есть поиск, пользователь ищет аниме, и API возвращает список различных аниме на основе поиска с небольшим количеством информации. Когда вы нажимаете на дополнительную информацию, должен появиться модал, который расскажет вам немного подробнее об аниме, на которое нажал пользователь. Вот что у меня есть

 return `  lt;div class="card" style="width: 18rem;"gt;  lt;div class="card-imagea"gt;  lt;img class="card-img-top" src="${anime.image_url}" alt="Card image cap"gt;  lt;div class="card-info"gt;  lt;p class="card-text"gt;Type: ${anime.type}lt;/pgt;  lt;p class="card-text"gt;Episodes: ${anime.episodes}lt;/pgt;  lt;p class="card-text"gt;Score: ${anime.score}lt;/pgt;  lt;/divgt;  lt;div class="card-body"gt;  lt;button type="button" id="modalLaunch" class="btn btn-primary"onclick="document.getElementById('id01').style.display='block'"gt;More Infolt;/buttongt;  lt;/divgt;  lt;/divgt; lt;!--w3 modal example--gt;  lt;div id="id01" class="w3-modal"gt;  lt;div class="w3-modal-content"gt;  lt;div class="w3-container"gt;  lt;div class="card-body"  lt;h5 class="card-title"gt;${anime.title}lt;/h5gt;  lt;p class="card-text"gt;${anime.synopsis}lt;/pgt;  lt;a href="${anime.url}" class="btn btn-primary"gt;More!lt;/agt;  lt;/divgt;  lt;/divgt;  lt;/divgt;  lt;/divgt;  lt;/divgt;     `  }).join("");    return `   lt;sectiongt;  lt;h3gt;${key.toUpperCase()}lt;/h3gt;  lt;div class="card-row"gt;${thereturnfunctionabove}lt;/divgt;   lt;/sectiongt;  `  }).join(""); }  

Проблема, с которой я сталкиваюсь, заключается в том, что модал не обновляется каждый раз, когда пользователь нажимает на новое название аниме. Я хочу, чтобы в любое время, когда пользователь нажимает на кнопку «Дополнительная информация», он обновлял модальную информацию для любого аниме, на которое он нажимает.