<div class='volledige-breedte floatleft' style='border:1px solid #ff0080' >
<div class='filterDiv linken2x2links'><a href='http://www.staplijst.com/wsv-wetteren.asp' target='staplijst_link'><img src='{#ImageRoot}/groot/010.jpg' class='logo100' alt='WSV Wetteren AKTIVIA 010' align='left'></a><a href='http://www.staplijst.com/wsv-wetteren.asp' target='staplijst_link'><b>WSV Wetteren</b></a> <img src='{#ImageRoot}/staplijst-zonnetje.gif' class='inline-icon16' alt='licentiehouder van Staplijst'><br><br>AKTIVIA 010<br> <div style='text-align:center;'><a href='{#WebRoot}/wandelclub-wsv-wetteren-aktivia-010.asp'>alle statistieken en grafieken <img src='{#ImageRoot}/btngrafiek24.png' class='inline-icon24' alt='wandelstatistieken, uitslagen en grafieken voor WSV Wetteren AKTIVIA 010'></a></div></div>
<div class='filterDiv linken2x2rechts'><a href='http://www.wandelclubegmont.be' target='staplijst_link'><img src='{#ImageRoot}/groot/163.jpg' class='logo100' alt='WSV Egmont - Zottegem AKTIVIA 163' align='left'></a><a href='http://www.wandelclubegmont.be' target='staplijst_link'><b>WSV Egmont - Zottegem</b></a> <img src='{#ImageRoot}/staplijst-zonnetje.gif' class='inline-icon16' alt='licentiehouder van Staplijst'><br><br>AKTIVIA 163<br><div style='text-align:center;'><a href='{#WebRoot}/wandelclub-wsv-egmont-uit-zottegem-aktivia-163.asp'>alle statistieken en grafieken <img src='{#ImageRoot}/btngrafiek24.png' class='inline-icon24' alt='wandelstatistieken, uitslagen en grafieken voor WSV Egmont - Zottegem AKTIVIA 163'></a></div></div>
<div class='weg filterDiv linken2x2links'><a href='http://www.zandstappers.be' target='staplijst_link'><img src='{#ImageRoot}/groot/A044.jpg' class='logo100' alt='Wandelclub Zandstappers v.z.w. VWF A044' align='left'></a><a href='http://www.zandstappers.be' target='staplijst_link'><b>Wandelclub Zandstappers v.z.w.</b></a> <img src='{#ImageRoot}/staplijst-zonnetje.gif' class='inline-icon16' alt='licentiehouder van Staplijst'><br><br>VWF A044<br><div style='text-align:center;'><a href='{#WebRoot}/wandelclub-zandstappers-uit-wechelderzande-vwf-a044.asp'>alle statistieken en grafieken <img src='{#ImageRoot}/btngrafiek24.png' class='inline-icon24' alt='wandelstatistieken, uitslagen en grafieken voor Wandelclub Zandstappers v.z.w. VWF A044'></a></div></div>
<div class='weg filterDiv linken2x2rechts'><a href='http://www.waterhoekstappers.be' target='staplijst_link'><img src='{#ImageRoot}/groot/345.jpg' class='logo100' alt='De Waterhoekstappers - Heestert AKTIVIA 345' align='left'></a><a href='http://www.waterhoekstappers.be' target='staplijst_link'><b>De Waterhoekstappers - Heestert</b></a> <img src='{#ImageRoot}/staplijst-zonnetje.gif' class='inline-icon16' alt='licentiehouder van Staplijst'><br><br>AKTIVIA 345<br><div style='text-align:center;'><a href='{#WebRoot}/wandelclub-waterhoekstappers-uit-heestert-aktivia-345.asp'>alle statistieken en grafieken <img src='{#ImageRoot}/btngrafiek24.png' class='inline-icon24' alt='wandelstatistieken, uitslagen en grafieken voor De Waterhoekstappers - Heestert AKTIVIA 345'></a></div></div>
<div class='weg filterDiv linken2x2links'><a href='http://www.stormvogels.be' target='staplijst_link'><img src='{#ImageRoot}/groot/070.jpg' class='logo100' alt='WSV De StormVogels vzw Oostende AKTIVIA 070' align='left'></a><a href='http://www.stormvogels.be' target='staplijst_link'><b>WSV De StormVogels vzw Oostende</b></a> <img src='{#ImageRoot}/staplijst-zonnetje.gif' class='inline-icon16' alt='licentiehouder van Staplijst'><br><br>AKTIVIA 070<br><div style='text-align:center;'><a href='{#WebRoot}/wandelclub-stormvogels-uit-oostende-aktivia-070.asp'>alle statistieken en grafieken <img src='{#ImageRoot}/btngrafiek24.png' class='inline-icon24' alt='wandelstatistieken, uitslagen en grafieken voor WSV De StormVogels vzw Oostende AKTIVIA 070'></a></div></div>
<div class='weg filterDiv linken2x2rechts'><a href='http://www.wandelmee.be' target='staplijst_link'><img src='{#ImageRoot}/groot/A054.jpg' class='logo100' alt='wandelmee.be VWF A054' align='left'></a><a href='http://www.wandelmee.be' target='staplijst_link'><b>wandelmee.be</b></a> <img src='{#ImageRoot}/staplijst-zonnetje.gif' class='inline-icon16' alt='licentiehouder van Staplijst'><br><br>VWF A054<br><div style='text-align:center;'><a href='{#WebRoot}/wandelmee.asp'>alle statistieken en grafieken <img src='{#ImageRoot}/btngrafiek24.png' class='inline-icon24' alt='wandelstatistieken, uitslagen en grafieken voor wandelmee.be VWF A054'></a></div></div>
<div class='filterDiv linken2x2links'><a href='http://www.velodroomvrienden.be' target='staplijst_link'><img src='{#ImageRoot}/groot/347.jpg' class='logo100' alt='Velodroomvrienden Moorslede AKTIVIA 347' align='left'></a><a href='http://www.velodroomvrienden.be' target='staplijst_link'><b>Velodroomvrienden Moorslede</b></a> <img src='{#ImageRoot}/staplijst-zonnetje.gif' class='inline-icon16' alt='licentiehouder van Staplijst'><br><br>AKTIVIA 347<br><div style='text-align:center;'><a href='{#WebRoot}/wandelclub-velodroomvrienden-uit-moorslede-aktivia-347.asp'>alle statistieken en grafieken <img src='{#ImageRoot}/btngrafiek24.png' class='inline-icon24' alt='wandelstatistieken, uitslagen en grafieken voor Velodroomvrienden Moorslede AKTIVIA 347'></a></div></div>
<div class='filterDiv linken2x2rechts'><a href='http://www.sterrebosstappers.be' target='staplijst_link'><img src='{#ImageRoot}/groot/314.jpg' class='logo100' alt='Sterrebosstappers Roeselare AKTIVIA 314' align='left'></a><a href='http://www.sterrebosstappers.be' target='staplijst_link'><b>Sterrebosstappers Roeselare</b></a> <img src='{#ImageRoot}/staplijst-zonnetje.gif' class='inline-icon16' alt='licentiehouder van Staplijst'><br><br>AKTIVIA 314<br><div style='text-align:center;'><a href='{#WebRoot}/wandelclub-sterrebosstappers-uit-roeselare-aktivia-314.asp'>alle statistieken en grafieken <img src='{#ImageRoot}/btngrafiek24.png' class='inline-icon24' alt='wandelstatistieken, uitslagen en grafieken voor Sterrebosstappers Roeselare AKTIVIA 314'></a></div></div>
</div>
<script type="text/javascript">
function performFilter() {
var filterArgument = $("#filterargument").val();
// alert(filterArgument);
// $('.filterDiv').filter(':even').css('background-color', '#ffccff');
// $('.filterDiv').filter(':odd').css('background-color', '#c1ffe0');
$('.filterDiv a[href]').filter(':even').css('border', '1px solid red');
$('.filterDiv').css('height','150px').filter(':even').text('text replaced !' + filterArgument);
$('.filterDiv').filter(
function(index) {
return $(this).hasClass('weg');
}
).css('background-color', '#c1ffe0');
}
$(document).ready(performFilter);
</script>
As you can see above I am playing around a bit with jQuery with the end-result in mind to let the user enter some characters in a field called filterargument after which only the <div> elements containing the characters entered will be displayed (the rest will be hidden with the .hide() method.
As always I tend to try something small first and slowly build up to the final code (as to fully understand what and why something is happening).
The lines with filter(':even') and filter(':odd') seem to work, but the
$('.filterDiv').filter(
function(index) {
return $(this).hasClass('weg');
}
).css('background-color', '#c1ffe0');
does not. I probably am missing something obvious (and I will certainly try to find the solution myself, but in the mean time I am hoping that some of you may point to my error.
Thanks in advance.
UPDATE
As result of the first answer I received, I added the ‘.’ character in front of the filterDiv . This was the solution.
i suppose it has to be
🙂