<input class="search-placeholder ml-16" type="text" name="search">

<select class="mile-counter"><option value="10">10 miles</option><option value="20">20 miles</option></select>
     <input type="text" name="location" class="location" placeholder="Enter Zip      or City">

let res = response.reduce((obj, item) => {
              obj[item.subSection] = obj[item.subSection] || [];
              obj[item.subSection].push(item.name);
              return obj;
            }, {});


            // get values array and iterate 
            Object.keys(res).forEach(function(k) {
              // generate h3 ith subSection value and append
              $('div.programs').append(
              $('<div class="section">' + k + '</div>')
                  //$('<h3>', {text: k})
                )
                // generate buttons and append
                    .append(res[k].map(v =>
                        $(`<button class="button">
                        <img class="programs-icons" src="/wwwroot/images/${v}.svg"                onerror="imgError(this);">
                        ${v}
                      </button>`)
                    ))
                })

<div class="population-text">Top 10 Population</div>

{
"text": "string",
 "attributes": [
    "string"
],
  "Population": 0
}