入力タグdivの外側にあるdivにフォーカスする方法

Question

入力タグがフォーカスされているときにdivを強調表示できません。 注：入力タグと私のターゲットのdivの両方が同じdiv.Pleaseにないコード

このよう

<div><input type="text"/></div> 
<div>this should change color when input is focused</div> 

Answer 1

を参照してください？ CSSができる」：
悪いニュースがある）;これは、あなたが親...叔父/叔母の兄弟を選択しようとしているdiv

$('#someInput').on("focus", function(){ 
 
    $("#someDiv").css("color", "red") 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div><input id="someInput" type="text" /></div> 
 
<div id="someDiv">this should change color when input is focused</div>

Answer 2

にcssを変更するjQueryを使用していますトンそれは
しかし、古き良きJSは

const trigger = document.getElementById("trigger"); 
 
const target = document.getElementById("target"); 
 

 
trigger.addEventListener("focusin", function() { 
 
    target.classList.add("triggered"); 
 
}); 
 
trigger.addEventListener("focusout", function() { 
 
    target.classList.remove("triggered"); 
 
});

.triggered { 
 
    color: red; 
 
}

<div> 
 
    <input id="trigger" type="text" /> 
 
</div> 
 
<div id="target">this should change color when input is focused</div>

トリックを行いますか