HTML中，鼠标划过一行字，如何判断它属于第几个<P>标签?

如题，现在一个HTML中有10个P标签，每个里头都有一句完全一样的话。
这时候鼠标划过其中一个P标签里的文字，请问如何获取这到底属于第几个P标签？

谢谢

---

循环加自定义属性index，划过时可以获取index

---

可以在p中添加数值id，或者加一个循环判断是第几个子节点

---

<div>
        <p>section</p>
        <p>section</p>
        <p>section</p>
        <p>section</p>
        <p>section</p>
        <p>section</p>
        <p>section</p>
        <p>section</p>
        <p>section</p>
        <p>section</p>
    </div>
    <script type="text/javascript">
        var ps=$("div p");
        ps.each(function(index,el){
            $(this).on("mouseover",function(){
                console.log(index);
            });
        });
    </script>

---

类似于这样:

$(".side li").on("mousemove",function(){
  var idx = $(this).index();
  console.log("第" + (idx + 1) + "个");
});

当前这是本页面右侧相似问题 测试的效果