Struggling on a project for freeCodeCamp related to the Wikipedia API. Despite being able to work with the data, I'm unsure about the syntax required to achieve my goal. Here's an example of the data I am dealing with: Wikipedia API Search.
In my HTML, I have a bootstrap modal that displays after user input in a form, showing a group with search results.
This is the code snippet I currently have:
$(document).ready(function () {
$('#searchForm').on('submit', function(e) {
e.preventDefault();
$('#wikiSearch').modal('show');
var usersearch = document.getElementById('userinput').value;
var apiURL = "https://en.wikipedia.org/w/api.php?
action=opensearch&search="
+ usersearch + "&format=json&callback=?";
$.ajax({
url: apiURL,
contentType: "application/json; charset=utf-8",
dataType: 'json',
type: 'GET',
success: function (data) {
data[1].forEach(function(item) {
$('#results').append("<tr><td><a href='#'>"+item+"</a></td></tr>")
});
data[2].forEach(function(item) {
$('#brief').append("<tr><td>"+item+"</td></tr>")
})
}
});
});
});
To display one result from the search in each group of my HTML modal, I attempted using a nested forEach loop but didn't get the desired output. Tried alternatives like map and a long nested for loop; however, just ended up confused. Any insight would be greatly appreciated!