Hi there, I've encountered a strange issue:
Could you take a look at this newly uploaded page:
On the page, there is a dropdown menu with various options (best viewed in Firefox or Safari).
When users select a specific option, all other instances are hidden.
HTML Here's the HTML code for the dropdown menu:
<select id="stadlijst">
<option value="javascript:history.go(0)">Select a province</option>
<option value="javascript:history.go(0)">Show all provinces</option>
<option value="antwerpen">Antwerp</option>
<option value="limburg">Limburg</option>
<option value="oost-vlaanderen">East Flanders</option>
<option value="west-vlaanderen">West Flanders</option>
<option value="vlaams-brabant">Flemish Brabant</option>
<option value="henegouwen">Hainaut</option>
<option value="luik">Liège</option>
<option value="luxemburg">Luxembourg</option>
<option value="namen">Namur</option>
<option value="waals-brabant">Walloon Brabant</option>
</select>
And here's the other section of the code:
<div class="lijst userstyle1 row">
<div class="stad-antwerpen adcont col-sm-6 col-md-3 col-lg-2">
<h3>Loox4Life</h3>
<h5>
Verlatstraat 3<br>
2000 Antwerp<br><br>
+32 495 78 11 50<br>
<a href="http://www.loox4life.com">www.loox4life.com</a></h5>
</div>
<div class="stad-vlaams-brabant adcont col-sm-6 col-md-3 col-lg-2">
<h3>Kim Skincare</h3>
<h5>Kleine Mechelsebaan 16<br>
3200 Aarschot<br><br>
+32 498 21 80 40<br>
<a href="http://www.kimvangramberen.be">www.kimvangramberen.be</a></h5>
</div>
</div>
JQUERY
$(document).ready(function () {
$('#stadlijst').on('change', function () {
$('.lijst div').show().not(".stad-" + this.value).hide();
});
});