Javascript 当文本输入到输入字段时，是否有方法更改div的背景？

我有下面的代码，我希望每次有人在输入字段中输入/键入文本时，强制类为“target_bg”的div的背景将其颜色从红色（默认）更改为绿色

<div class="target_bg"></div>
<input placeholder="Search for Restaurants..." 
class="search_field" name="" type="text">

我搜索了很多解决方案，但只找到了如何更改输入字段本身的背景。

如果使用jquery：

$('.search_field').on('input', function() {
   $('.target-bg').css('background-color','green');
});

---

下面是一个使用纯javascript的解决方案

var bglelement=document.querySelector（'.target_bg'）；
var输入=document.querySelector（'.search_字段'）；
input.oninput=function（）{bgElement.style.background='green'；}
.target\u bg{
宽度：50px；
高度：50px；
背景：红色；
}

可能重复@Designer有关此问题的任何新闻？当字段为空时，是否有简单的方法将div的背景再次转换为默认颜色？？如果我删除字段的文本。。