How do I make my menu appear on click with css - html

Question

When I hover over the Menu it shows the dropdown menu.
I want it to happen on click.
I tried it but it didnt work for me.
This is my code:
HTML:
<div class="responsive-menu">
<ul>
<li>Menu
<ul>
<li>Zomer</li>
<li>Herfst</li>
<li>Winter</li>
<li>Lente</li>
</ul>
</li>
</ul>
</div>
CSS:
li {
list-style-type:none;
}
.responsive-menu {
display:block;
background-color:black;
color:white;
text-align:center;
padding:10px;
font-size:200%;
}
.responsive-menu ul li ul li {
padding:10px;
border-bottom:solid 1px white;
border-top:solid 1px white;
}
.responsive-menu ul li ul {
display:none;
font-size:60%;
padding-top:30px;
}
.responsive-menu ul li:hover ul {
display:block;
}
Here is a link to JSFiddle.

Answer 1

Instead of the :hover pseudo-class you should use the :focus pseudo-class.
.responsive-menu ul li:focus ul {
display:block;
}
To let the li gain focus it needs a tabindex attribute
<li tabindex="9999">Menu
http://jsfiddle.net/t78mf7jb/1/
amend
For not having the focus effect from browser add a outline:none style on the li
.responsive-menu ul li:focus {
outline: none;
}
http://jsfiddle.net/t78mf7jb/3/

Answer 2

HerrSerkers answer is a good answer, but there is another if you're willing to change your markup a little. You can simulate a click by using checkbox with it's label, like:
li {
list-style-type: none;
}
.responsive-menu {
display: block;
background-color: black;
color: white;
text-align: center;
padding: 10px;
font-size: 200%;
}
.responsive-menu ul li ul li {
padding: 10px;
border-bottom: solid 1px white;
border-top: solid 1px white;
}
.responsive-menu ul li ul {
display: none;
font-size: 60%;
padding-top: 30px;
}
#trigger {
display: none;
}
#trigger:checked + .responsive-menu ul li:hover ul {
display: block;
}
<input type="checkbox" id="trigger" />
<div class="responsive-menu">
<ul>
<li>
<label for="trigger">Menu</label>
<ul>
<li>Zomer</li>
<li>Herfst</li>
<li>Winter</li>
<li>Lente</li>
</ul>
</li>
</ul>
</div>
JSFiddle
Update - as HerrSerker pointed out, there is a flaw regarding closing the menu - check his fiddle with a fix.