如何仅使用JavaScript通过类名获取同级元素并实现隐藏？

以下两种写法可以完全对齐你给出的jQuery逻辑效果：

通用写法（适配所有同级.content元素，和jQuery.siblings逻辑完全一致） #

不管.content元素在#xyz的前面还是后面，只要是同级元素都能匹配到：

// 获取#xyz元素
const xyz = document.getElementById('xyz');
// 查找父级下所有.content元素，过滤掉自身后设置隐藏
xyz.parentElement.querySelectorAll('.content').forEach(el => {
  if (el !== xyz) el.style.display = 'none';
});

简化写法（适配你给出的固定HTML结构） #

如果你确定.content是#xyz的下一个相邻兄弟元素，和你贴的HTML结构完全一致，可以直接用更短的代码：

document.getElementById('xyz').nextElementSibling.style.display = 'none';

小提示：你贴的jQuery示例代码存在拼写错误，dispaly 应该修正为 display 才能正常生效。

内容的提问来源于stack exchange，提问作者Padawan