Thu, 2016-03-31 21:03
Hello community,
I try to filter some objects in a timetable / grid. I don't have access to edit the making of the grid since it comes from a website construction kit. (Hence I know less than few about coding with CSS.)
The generated grid looks like this:
<div id="grid1459411200000" class="gridSlot gridBusy gridAm" > <span> 10:00 </span> </div> <div id="grid1459413000000" class="gridSlot gridBusy gridAm gridNoFree" > <span> 10:30 </span> </div> <div id="grid1459414800000" class="gridSlot gridBusy gridAm gridNoFree" > <span> 11:00 </span> </div> <div id="grid1459416600000" class="gridSlot gridBusy gridAm" > <span> 11:30 </span></div> <div id="grid1459418400000" class="gridSlot gridBusy gridPm gridNoFree" ><span> 12:00 </span></div> <div id="grid1459420200000" class="gridSlot gridBusy gridPm gridNoFree" ><span> 12:30 </span></div>
I can hide all elements with the class gridNotFree with div.gridNoFree {display: none;}, but that hides too much in some circumstances.
In my example I want to filter the <div> elements, in which the <span> equals 10:30, 11:00, 12:00 or 12:30.
Is there a way to do that?
Thu, 2016-03-31 23:06
#1
You may have to use
You may have to use JavaScript to target the specific text element you don't want hidden.
Here's a untested jQuery example:
$('.gridNoFree span').each( function(){ if($(this).text() == '12:30') { $(this).parent().css('display', 'block'); } } );