Link to div inside div within same HTML

Question

I am currently using Bootstrap Timeline (example here). Since this will be a long timeline I want at the top of it to have some symbols (each with a date and a unique ID), which will represent certain event. When clicking a certain symbol I want to be redirect to the correspondent event on the timeline.

Nevertheless, at the moment, when I click the symbol I am redirected to the top of the div 'container' which contains the timeline and not to the specific <li>

Example: LINK:

<ol class="timeline">
   <li class="timeline__step done">
        <a href="#type1" id="type1"></a>
    </li>

</ol>

TO:

<div class="container">
     <ul class="timeline2">
        <li id = "type1" onclick = "window.location.hash = 'type1';">
        </li>
     <ul>
<div>`

Answer 1

Remove id from the link and remove the onclick from the timeline item. The hashtag in href should jump to the id set in the timeline item.

<ol class="timeline">
   <li class="timeline__step done">
        <a href="#type1"></a>
    </li>
</ol>

<div class="container">
     <ul class="timeline2">
        <li id="type1">
        </li>
     <ul>
<div>