javascript - 更改鼠标悬停标题上的文字颜色

Question

我正在尝试设置一个页面，其中连续显示多个标题，下面有一段描述性内容。当用户滚动标题时，段落将根据他们悬停的标题进行更改。我希望每个标题都是不同的颜色，并且段落的字体颜色应该更改以匹配标题的颜色。我遇到的问题是让段落的颜色发生变化。

这是我的例子:

<script type="text/javascript">
function onover(caption)
{document.getElementById('text').innerHTML=caption;}
{document.getElementById('text2').innerHTML=caption;}
</script>

<a onmouseover="onover('Paragraph 1')" style="color:green">Title 1</a>
<a onmouseover="onover('Paragraph 2')" style="color:red">Title 2</a>
</br>
<div id="text" style="color:green">Paragraph 1</div>
<div id="text2" style="color:red"></div>

Answer 1

已更新由于 OP 想要替换文本，

<script type="text/javascript">
       function onover(caption,color) {
          document.getElementById('text').innerHTML=caption;
          document.getElementById('text').style.color=color;
          document.getElementById('text2').style.color=color;
   } 
</script>

<a onmouseover="onover('Paragraph 1','green')" style="color:green" id='one'>Title 1</a>
<a onmouseover="onover('Paragraph 2','red')" style="color:red">Title 2</a>
</br>
<div id="text" style="color:green">Paragraph 1</div>

Demo

Update 2