How to get all data (coordinates) from table with specific class name, and load them in map - Leaflet,.js

Question

I am trying to get data/coordinates from my table on website and then show markers of that coordinates on leaflet map, but it seems I am getting something wrong because it is not working and I am getting this error:

Currently, I have one for loop that will make markers for every coordinate on map:

function getInputValue() {
        var inputVal1 = document.getElementsByClassName("coord");//class name of coordinates, see picture below
        var inputVal = inputVal1.replace(/\s/g, ',');//format coordinates a little bit, also i tried to put toString()  here, but no luck
        inputValArr = JSON.parse(inputVal);
        var visualmarker;
    
        for (let i = 0; i < inputVal.length; i++) {
            visualmarker = L.marker([inputVal[i]], iconOptionsfire);
            visualmarker.addTo(map);    
        }
    }

Picture of one of coordinates table in HTML:

Thank You very much, I am here if you need more info

Answer 1

• You've to convert the string to an array
• Pass that array to the marker function.

Try replacing the code

function getInputValue() {
   var inputs = document.getElementsByClassName("coord");
   for (let i = 0; i < inputs.length; i++) {
      var inputVal = inputs[i].innerHTML;
      var coordArr = inputVal.split(" ").filter(Boolean);
      var visualmarker = L.marker(coordArr, iconOptionsfire);
      visualmarker.addTo(map);
    }
}