JS Bin// source https://jsbin.com/jidanaj

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin-neighborhood map</title>
  <script src="https://code.jquery.com/jquery.min.js"></script>
  <link href="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" type="text/css" />
  <script src="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
<style id="jsbin-css">
#map {
  width: 100%;
  height: 400px;
  background-color: lightblue;
  margin-bottom:20px;
      }

#itemList{
  list-style:none;
}
li{
  text-align:center;
  margin-left:-10px;
  padding-bottom:10px;
}
#searchform{
  width:50%;
  border:1px solid rgba(150,172,183,0.4);
  border-radius:5px;
  margin-left:10px;
  background-color:rgba(150,172,183,0.4);
}
#inputSearch{
  width:90%;
  margin:15px auto 5px auto;
  padding:5px;
  display: block;
}
</style>
</head>

<body>
  <h3>My Google Maps Demo</h3>
  <div id="map"></div>
  <form id='searchform'>
    <div id='seachBar' class='form-group'>
      <div class="col-sm-10">
        <input class="form-control" id='inputSearch' autocomplete="off">
        <hr></hr>
        <ul id='itemList'>
          <li>Suppenkuche</li>
          <li>The Matterhorn Swiss</li>
          <li>Red Tavern</li>
          <li>Cage Marika</li>
          <li>Leopold's</li>
          <li>Lolinda</li>
        </ul>
      </div>
    </div>
  </form>
  
  <script async defer src="https://maps.googleapis.com/maps/api/js?key=aizasydqa-v9x6g9mim8m-0q6_4x7pqc7x5ct5i&libraries=places&callback=initmap">
  </script>
<script id="jsbin-javascript">
// var geojsonModel = {
//   "type": "FeatureCollection",
//   "features": [{
//     "type": "Feature",
//     "properties": {
//       "name": "Suppenkuche"
//     },
//     "geometry": {
//       "type": "Point",
//       "coordinates": [-122.426445,
//         37.776521
//       ]
//     }
//   }, {
//     "type": "Feature",
//     "properties": {
//       "name": "The Matterhorn Swiss"
//     },
//     "geometry": {
//       "type": "Point",
//       "coordinates": [-122.423855,
//         37.798635

//       ]
//     }
//   }, {
//     "type": "Feature",
//     "properties": {
//       "name": "Red Tavern"
//     },
//     "geometry": {
//       "type": "Point",
//       "coordinates": [-122.483262,
//         37.782233

//       ]
//     }
//   }, {
//     "type": "Feature",
//     "properties": {
//       "name": "Cage Marika"
//     },
//     "geometry": {
//       "type": "Point",
//       "coordinates": [-122.403741,
//         37.797579
//       ]
//     }
//   }, {
//     "type": "Feature",
//     "properties": {
//       "name": "Leopold's"
//     },
//     "geometry": {
//       "type": "Point",
//       "coordinates": [-122.422194,
//         37.799182
//       ]
//     }
//   }, {
//     "type": "Feature",
//     "properties": {
//       "name": "Lolinda"
//     },
//     "geometry": {
//       "type": "Point",
//       "coordinates": [-122.419193,
//         37.756871
//       ]
//     }
//   }]
// };
var map;
var marker;
var markers = [];
var tempArr = [[-122.426445,37.776521, 'Suppenkuche'],[-122.423855,37.798635, 'The Matterhorn Swiss'],[-122.483262,37.782233, 'Red Tavern'],[-122.403741,37.797579,'Cage Marika'],[-122.422194,37.799182,"Leopold's"],[-122.419193,37.756871,'Lolinda']];

function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    zoom: 11,
    center: new google.maps.LatLng(37.775560, -122.418667),
  });
  generateMarkers(tempArr);
}

var input = document.getElementById('inputSearch');
input.addEventListener('keyup', showPlaceList);

function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    zoom: 11,
    center: new google.maps.LatLng(37.775560, -122.418667),
  });
  generateMarkers(tempArr);
}

var input = document.getElementById('inputSearch');
input.addEventListener('keyup', showPlaceList);

</html>

Updated missing url https://maps.googleapis.com/maps/api/js?key=AIzaSyDQA-V9x6g9MIm8m-0q6_4X7PQC7x5Ct5I&libraries=places&callback=initMap to https://maps.googleapis.com/maps/api/js?key=aizasydqa-v9x6g9mim8m-0q6_4x7pqc7x5ct5i&libraries=places&callback=initmap

https://code.jquery.com/jquery.min.js

https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js

https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js

https://maps.googleapis.com/maps/api/js?key=AIzaSyDQA-V9x6g9MIm8m-0q6_4X7PQC7x5Ct5I&libraries=places&callback=initMap