String does not match expected pattern d3 select

I am using d3 v5 for data visualization, I have created a force layout with each of the nodes having their own name as id. This part is done dynamically. The HTML part works fine , the userInput.value will return me an id with "/" in it (The ID for the node in this case is "foo/A" ). However the d3.select function fails when selecting an ID value with forward slash in it. Is there a way to bypass this error without renaming all the nodes?

var userInput = document.getElementById("targetNode");
  var theNode = d3.select("#" + userInput.value);