appending a picture to div when button is clicked

Question

What I'm trying to do is have users input to be added to the string and the picture of google streetview append to the div called map

I tried two different codes but neither worked.

$("#search").click(function(){
var citySearch = $("#city").val();
var map = $("map");
var streetView = "https://maps.googleapis.com/maps/api/streetview?size=400x400&location="+ citySearch + "";
map.append('<img src="'+ streetView +'">')

})

and also used this with the button being onclick myFunction and onsumbit myFunction

function myFunction(){
var citySearch = $("#city").val();
var map = $("map");
var streetView = "https://maps.googleapis.com/maps/api/streetview?size=400x400&location="+ citySearch + "";
map.append('<img src="'+ streetView +'">')

}

HTML

<input type="text" name="" id="city">
<button id="search" onclick="myFunction()">Submit</button>

<div id="map">

</div>

Answer 1

如果您打算在ID为“ map”的div内渲染图像，则您的jQuery选择器必须为#map ，而不是map ：

var map = $("#map");