title: d3.js when click outside the elements, hide the element
body: <p>I have some tootips in my page. There is one tooltip(div) contains a input box and a button. I want to click outside the tooltip and then hide the tooltip. I tried this:</p>
  
  <pre><code>d3.select("body")
  .on("click",function(){
      d3.select("#tooltip")
      .classed("hidden",true);
  });
  </code></pre>
  
  <p>This works, but when I click the input box want to input some value, the tooltip still hide. How can I hide the tooltip only when I click outside the tooltip?</p>
  
  <p>I also tried:</p>
  
  <pre><code>d3.select("body").filter().on("click",function(){})
  </code></pre>
  
  <p>But I don't how it works, I cannot select all elements except the tooltip(div).</p>