I have a list in HTML/JS being pulled from a JSON database. I need to have each row link to their respective pages. I've done this before in Laravel, but I absolutely no idea how to achieve this in JS. Any help is greatly appreciated.
<body>
<table id="userdata" style="width: 100%;">
<tbody id="jobsData">
<tr>
<td>
<div style='padding-top: 1%; padding-bottom: 1%;'>
<a href="specificPageForEachRow">
<div style='border: 1.7px solid black; border-radius: 10px; padding: 2%;'>
<span >
<img src='/img/logo2.png' height='60px'>
</span>
<span style='padding-top: 1%; padding-bottom: 1%; color: black; font-weight: 500;'>
f.role @ f.company
<br>
f.location
</span
</div>
</a>
</div>
</td>
</tr>
</tbody>
</table>
</body
Sample JSON data:
{"records":[{"id":"recgBheSJnv3Zhtjy","createdTime":"2015-11-17T17:30:26.000Z","fields":{"company":"Chapel Hill Chameleons","role":"Mascot","logo":"https://dl.airtable.com/.attachments/590d18b9a1c16ee8b11a9ec262400f68/3f27f14e/logo2.png","roleDescription":"Looking to rebrand—rumor has it that their current mascot, Charlie Chameleon, is stepping down soon, and they need a new mascot for the team.","location":"Chapel Hill, NC","companyDescription":"Minor league hockey team","dateAdded":"2015-11-17"}}]}