How do I add coordinates to an SVG polyline?

If you add an id attribute to the polyline so that it looks like this

<polyline id="polyline-id" points="0, 240 40, 25 60, 40 80, 120 120, 140 200, 180 500, 120 600, 5" style="fill:none;stroke:#000;stroke-width:3" />

you can get a reference to it via document.getElementById

The simplest way is to manipulate it via getAttribute/setAttribute on the "points" attribute

var points = polyline.getAttribute("points");
points += "10, 20";
points.setAttribute("points", points);

but the highest performance option is the SVG DOM as that avoids serialising the points data to/from a string - all UAs I know of store the data internally as an array of floats or doubles rather than a string.

var svg = document.getElementById('svg');
var point = svg.createSVGPoint();
point.x = 10;
point.y = 20;
var polyline= document.getElementById('polyline-id');
polyline.points.appendItem(point);

var polyline= document.getElementById('polyline-id')
  , points = polyline.getAttribute('points');

points += '12, 23'; // example
polyline.setAttribute('points', points );

may not work if the polyline is already rendered, so you need to use setAttributeNS: https://developer.mozilla.org/en-US/docs/Web/API/Element.setAttributeNS and getAttributeNS: https://developer.mozilla.org/en-US/docs/Web/API/Element.getAttributeNS

an another option is to use some library like http://www.svgjs.com/ or http://snapsvg.io/