Is there a way to create Javascript filter with radio buttons and checkboxes?

I have this task that has to been done soon, I have been trying to figure it out for the past couple of days but unfortunately, I have failed every time. I need to create a filter, where the user can click on a radio button to get those specific courses, after that or even before, he can click on checkboxes to filter even further.

I have managed to go through the "first" part of the filtering with radio buttons, the biggest issue is that I can't filter with checkboxes because for example -> you can't choose 2 options from the checkboxes.

Here is HTML

                    By subject:<br>
                    <form action="">
                            <input type="radio" name="name" value="Computing & IT">Computing & IT</input><br>
                            <input type="radio" name="name" value="Psychology & Sociology">Psychology & Sociology</input><br>
                            <input type="radio" name="name" value="Business & Management">Business & Management</input><br>
                            <input type="radio" name="name" value="Law & Criminology">Law & Criminology</input><br>
                            <input type="radio" name="name" value="Data Analytics">Data Analytics</input><br>
                            <input type="radio" name="name" value="Finance">Finance</input><br>
                            <input type="radio" name="name" value="Human Resource Management">Human Resource Management</input><br>
                            <!-- <input type="submit" value="Submit"> -->
                    </form>
                    <hr>
                    <h4> By Award:</h4>
                    <form action="">
                        <input type="checkbox" value="Postgraduate">Postgraduate</input><br>
                        <input type="checkbox" value="Undergraduate">Undergraduate</input><br>
                        <input type="checkbox" value="Top-Up">Top-Up</input><br>
                    </form>

and here is JS

fetch("https://api.myjson.com/bins/1axsrs")
.then(response => response.json())
.then(data =>  {
    let api_array = data.name;
    let radio = document.querySelectorAll('input[type=radio]');
    let checkboxes = document.querySelectorAll('input[type=checkbox]')
    api_array.map(item => {
        document.getElementById('app').innerHTML +=
        `<div class="card">
        <h6>${item.vertical}</h6>
        <h4>${item.program}</h4>
        <p>${item.level}</p>
        <button class="myButton">Enquire Now</button>
        `
    })
    for(let select of radio) {
        select.addEventListener('click',() => {
            document.getElementById('app').innerHTML = "";
            let api_array = data.name.filter(e => e.vertical === select.value)
            api_array.map(item => {
                document.getElementById('app').innerHTML +=
                `<div class="card">
                <h6>${item.vertical}</h6>
                <h4>${item.program}</h4>
                <p>${item.level}</p>
                <button class="myButton">Enquire Now</button>
                `
            })
            for(let check of checkboxes) {
                check.addEventListener('change',() => {
                    document.getElementById('app').innerHTML = "";
                    if(check.checked) {
                    let chosen = api_array.filter(c => c.level === check.value)
                    chosen.map(item => {
                        document.getElementById('app').innerHTML +=
                        `<div class="card">
                        <h6>${item.vertical}</h6>
                        <h4>${item.program}</h4>
                        <p>${item.level}</p>
                        <button class="myButton">Enquire Now</button>
                        `
                    })
                    } else {
                    }
                }) 
            }
        })
    }
})