Getting table from Leaflet map

Question

I have a map Here based on leaflet JS and the layers are geojson. I would like to get a table at on another div when I click on each layers.

How would I be able to do that?

Answer 1

You prepare an empty table with an id

<table id="properties"></table>

And you populate it with innerHTML property

for (var prop in properties) {
   if (properties.hasOwnProperty(prop)) { 
        document.getElementById("properties").innerHTML = document.getElementById("properties").innerHTML + "<tr><td>" + prop + "</td><td>" + properties[prop] + "</td></tr>";
   } 
}

See on this JSFiddle (it is done on mouseover, but you should be able to change it easily)