Quiero redirigir al hacer clic en el elemento
EX: class="nav-item" data-nav-item="1"
al enlace que está definido en su etiqueta secundaria "a"
<div class="nav-item" data-nav-item="1"> <div class="item-parent"> <a href="https://mywebsite-men.com">MEN</a> </div> </div> <div class="nav-item" data-nav-item="2"> <div class="item-parent"> <a href="https://mywebsite-women.com">Women</a> </div> </div>
Puede usar el click
para activar el clic cuando se hace clic en el elemento principal
[...document.getElementsByClassName('nav-item')].forEach(item => { item.addEventListener('click', (e) => { item.querySelector('a').click() }) })
.nav-item { width: 50px; height: 20px; padding: 10px; border: 1px solid green; cursor: pointer; }
<div class="nav-item" data-nav-item="1"> <div class="item-parent"> <a href="https://mywebsite-men.com">MEN</a> </div> </div> <div class="nav-item" data-nav-item="2"> <div class="item-parent"> <a href="https://mywebsite-women.com">Women</a> </div> </div>