Can not read property value of null

Hello,
I have working on one project but some problem in given code Uncaught TypeError: Cannot read property ‘value’ of null Please give me help.

function map(div) { alert(div); var map = L.map(div, { center: [22.04,79.23], zoom: 5, fullscreenControl: { pseudoFullscreen: false} }); L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpandmbXliNDBjZWd2M2x6bDk3c2ZtOTkifQ._QA7i5Mpkd_m30IGElHziw', { maxZoom: 18, attribution: 'Map data © OpenStreetMap contributors, ' + 'CC-BY-SA, ' + 'Imagery © Mapbox', id: 'mapbox.streets' }).addTo(map); var popup = L.popup(); function onMapClick(e) { popup .setLatLng(e.latlng) .setContent("You clicked the map at " + e.latlng.toString()) .openOn(map); } map.on('click', onMapClick); //var marker = L.marker([51.5, -0.09]).addTo(map); var drawnItems = new L.FeatureGroup(); map.addLayer(drawnItems); //geomfeatures=document.getElementById("featurebox"); geomfeatures=document.getElementById("featurebox"); alert(geomfeatures.childNodes.length); for (i=0;i<=geomfeatures.childNodes.length;i++) { lat=document.getElementById('latitude'+i).value; alert(lat); lng=document.getElementById('longitude'+i).value; alert(lng); L.marker([lat,lng]).bindPopup("Hello World").addTo(map); } <% response.setHeader("Cache-Control", "no-cache"); //Forces caches to obtain a new copy of the page from the origin server response.setHeader("Cache-Control", "no-store"); //Directs caches not to store the page under any circumstance response.setDateHeader("Expires", 0); //Causes the proxy cache to see the page as "stale" response.setHeader("Pragma", "no-cache"); //HTTP 1.0 backward compatibility %> <% ArrayList temp = null; temp = Join.getGeometryList(); request.setAttribute("geom", temp); %>
" value=""/> " value=""/>