Trouble getting google map to update location through geocoding a users search - google-maps-api-3

Question

I am trying to have my map update with the users input in the mapSearch box when they hit submit but I'm missing something that's not connecting the submit onclick function with the latlng variable.
var geocoder;
var map;
function initialize() {
geocoder = new google.maps.Geocoder();
var latlng =new google.maps.LatLng(-34.397,150.644);
var mapProp = {
center: latlng,
}
var map=new google.maps.Map(document.getElementById("googleMap"), mapProp);
};
var searchBox = new google.maps.places.SearchBox(document.getElementById('mapsearch'));
google.maps.event.addDomListener(searchBox, 'places_changed', function(){
var places = searchBox.getPlaces();
var bounds = new google.maps.LatLngBounds();
var i, place;
for (i=0; place=places[i]; i++){
bounds.extend(place.geometry.location);
}
});
$( "#Submit" ).click(function codeAddress(){
var address = document.getElementById("mapsearch").value;
geocoder.geocode( {'mapsearch': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK){
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results [0].geometry.location
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
});

Answer 1

I get a javascript error with the posted code: InvalidValueError: unknown property mapsearch on this line: geocoder.geocode( {'mapsearch': address}, (that should be 'address'):
$("#Submit").click(function codeAddress() {
var address = document.getElementById("mapsearch").value;
geocoder.geocode({
'address': address
},
code snippet:
var geocoder;
var map;
function initialize() {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(-34.397, 150.644);
var mapProp = {
center: latlng,
zoom: 3
}
var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);
$("#Submit").click(function codeAddress() {
var address = document.getElementById("mapsearch").value;
geocoder.geocode({
'address': address
},
function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
});
}
google.maps.event.addDomListener(window, "load", initialize);
html,
body,
#googleMap {
height: 100%;
width: 100%;
margin: 0px;
padding: 0px
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js"></script>
<input id="Submit" type="button" value="submit" />
<input id="mapsearch" value="New York, NY" />
<div id="googleMap"></div>