Issue
I'm trying to figure out if it's possible to filter a row of divs based on selection from a second row of divs. To put it in example, let's say we have the following structure
<div class="firstRow">Text1</div>
<div class="firstRow">Text2</div>
<div class="firstRow">Text3</div>
<div class="secondRow">Text1</div>
<div class="secondRow">Text2</div>
<div class="secondRow">Text3</div>
What I want is to hide/remove Text2
and Text3
divs (secondRow
class) if Text1
div (firstRow
class) is clicked. Therefore only Text1
(secondRow
class) should remain. So basically firstRow
divs should work like filters.
I tried making 2 arrays from these 2 classes and looping through them to compare their text values, but don't know where to go from there.
Solution
I think you got a downvote because someone wants you to post what you've tried instead of just asking for an answer. In any case:
$('.firstRow').click(function() {
//hide all, then show only those with the same text content
$('.secondRow').hide().filter(':contains(' + $(this).text() + ')').show();
});
https://jsfiddle.net/q39ta071/
Answered By - Mark
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.