Hi, I am creating a site where my client want me to make him a custom filter. There would be 4 sections each bears radio buttons coming from a collection. Below these sections there is another collection dynamic list, and the item of this list shall only show regarding the selection of radio buttons above. This collection has reference field of all above radio buttons collection.
Check this link http://lacoliquid-sample.webflow.io/home-2
You can see the radio buttons they comes from 4 different collections. When you click the radio button from each of the 4 sections the below section where you can the bold words i.e “Personal Care - Powder - Bag - Plastic”.
P.S. this last section’s content also comes from a collection and bearing a reference of each section of radio buttons.
I am trying to make the question more simple and concise.
Now here is q div (having a class “Div1”) it is bearing 3 radio button in each radio buttons group. See an example here
You can see in output span there are some bold text, I want to keep it hide initially and each of them should only show up according to selection of radio button. i.e. if you have selected “Liquid” radio button then only that link should show which is bearing the word “Liquid”.
My logic is if we copy each line’s text to the same line’s div’s class and then compare value or label of radio button with that div class whether they are equal and if thy are equal then show the line else keep it hide.
I have got a jquery code where it is copying the line text into a div class but it is copying the text for all sibling divs.