css - d3.select.attr only working with some attributes when called from a hover action -

i'm trying action work when hover on table row. want table row turn gray, stroke of chart corresponds table row turn red width of 5, every other stroke turn gray.

here snippet of code:

var paths = d3.selectall("path");  var rows = tbody.selectall("tr")     .data(data)     .enter()     .append("tr")     .on("mouseover", function(d,i) {         d3.select(this)         .style("background-color","gray");          //this works         d3.select(paths[0][i]).attr("stroke-width", 5);          //this sets them gray         d3.selectall("path").attr("stroke", "gray");          //this doesn't work???         d3.select(paths[0][i]).attr("stroke", "red");       }); 

my thought first turn them gray, turn individual 1 red. reason, changing stroke attribute on 1 of paths doesn't work, changing stroke attribute on paths works , changing stroke-width attribute on 1 of paths works.

am doing wrong?

try use .style() instead of .attr()

 d3.select(paths[0][i]).style("stroke", "red");