입력 태그 div 외부에있는 div를 초점 맞추는 방법

Question

입력 태그가 집중 될 때 div를 강조 표시하지 않습니다. 참고 : 입력 태그 내 목표 DIV 년대 모두 코드이 같이

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

Answer 1

를 참조 같은 div.Please에 있지? 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를 사용 t는
그러나 좋은 팔자 '의 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>

,