can't get the child of a div clicked

i want to when i click on the div ‘nav-item’ the child tag a get clicked , i have try some way but it’s not working for me

PS : i don’t want to wrap the parent div with tag a

<div class="nav-item" data-nav-item="1">
  <div class="item-parent">
    <a href="https://mystore-men.com">MEN</a>
  </div>
</div>
<div class="nav-item" data-nav-item="2">
  <div class="item-parent">
    <a href="https://mystore-women.com">Women</a>
  </div>
</div>

jquery :

$('.nav-item').click(function () {
  $(this).children('a').click();  
});

can anyone help please ?

>Solution :

You should use the find jquery method since find method returns all the descendant elements like child, grandchild and so on.

Here’s the jquery code,

$('.nav-item').click(function () {
  $(this).find('a')[0].click();
});

The find method returns all the descendant a elements. I’m selecting the first one [0] and triggering the click event.