How to get sibling element by its class name and then hide it using Javascript only?

Question

I have this html structure:

  <div id="xyz"> </div>
  <div class="content"> </div>

i want to hide the element with class named content given the sibling element id which is xyz , in jQuery i can easily do it like this:

$("#xyz").siblings('.content').css({"dispaly": "none"});

how can i achieve the same thing using pure Javascript only ?

Answer 1

document.querySelector("#xyz + .content").style.display = "none";

jsfiddle