Trying to add a drop down menu to a complicated navigation bar

Question

I've been tasked with modifying a website. I'm a volunteer and I have some experience with web development. I'm trying to add a drop down menu into the nav bar. From the examples I found (simpler ones) I couldn't come up with a solution for the code below. Any ideas? If you need other sources I can provide. e.g. the css so you can visualise in Liveweaver or similar.

<header>
            <div class="divLink" id="divLogo"><!-- Open divLogo -->
                <a id="navLogo" href="../Home/"><img src="../Pictures/logo.png" height="50px" width="43px"></a>
            </div><!-- Close divLogo -->
            <div class="divLink"><!-- Open divHome -->
                <a id="navLink" href="../Home/">Home</a>
            </div><!-- Close divHome -->
            <div class="divLink"><!-- Open divLink -->
                <a id="navLink" href="../Volunteering/">Volunteering</a>
            </div><!-- Close divLink -->
            <div class="divLink"><!-- Open divLink -->
                <a id="navLink" href="../CommunityGroups/">Community Groups</a>
            </div><!-- Close divLink -->
            <div class="divLink"><!-- Open divLink -->
                <a id="navLink" href="../SocialEnterprise/">Social Enterprise</a>
            </div><!-- Close divLink -->
            <div class="divLink"><!-- Open divLink -->
                <a id="navLink" href="../CommunityPlanning/">Community Planning</a>
            </div><!-- Close divLink -->
            <div class="divLink"><!-- Open divLink -->
                <a id="navLink" href="../Downloads/">Downloads</a>
            </div><!-- Close divLink -->
            <div class="divLink"><!-- Open divLink -->
                <a id="navLink" href="../About/">About Us</a>
            </div><!-- Close divLink -->
            <div class="divLink"><!-- Open divLink -->
                <a id="navLink" href="../Contact/">Contact Us</a>
            </div><!-- Close divLink -->
            <div tabindex="0" class="navMenu"><span></span>
                <ul>
                    <a onclick="location.href='../Home/'"><li>Home</li></a>
                    <hr>
                    <a onclick="location.href='../Volunteering/'"><li>Volunteering</li></a>
                    <hr>
                    <a onclick="location.href='../Volunteering/Under25.html'"><li>Volunteering Under 25</li></a>
                    <hr>
                    <a onclick="location.href='../CommunityGroups/'"><li>Community Groups</li></a>
                    <hr>
                    <a onclick="location.href='../SocialEnterprise/'"><li>Social Enterprise</li></a>
                    <hr>
                    <a onclick="location.href='../CommunityPlanning/'"><li>Community Planning</li></a>
                    <hr>
                    <a onclick="location.href='../Downloads/'"><li>Downloads</li></a>
                    <hr>
                    <a onclick="location.href='../About/'"><li>About Us</li></a>
                    <hr>
                    <a onclick="location.href='../Contact/'"><li>Contact Us</li></a>
                </ul>
            </div>
        </header>