JSFiddle - React, Tailwind, and code Playground
HTML
<div class="container">
<p>one</p>
<p>two</p>
<p>three</p>
</div>
<div class="container">
<p>one</p>
<p>two</p>
<p>three</p>
<p>four</p>
<p>five</p>
</div>
CSS
p {
border: 1px solid #ccc;
padding: 5px;
margin: 2px;
text-align: center;
cursor: pointer;
width: 200px;
}
p:hover {
border-color: #000;
color: #f00;
}
JavaScript
$(function() {
$('.container').on('click', 'p', function() {
alert( 'номер элемента внутри родителя: ' + ($('.container').index() + 1) );
});
});