Thank you very much for a great answer which nearly solved my
question in a very elegant way, I have even discovered in studying
selectors a little more thouroughly ( jquery doc) that you can use
jQuery('.choix').click(function(e) {
$(this).parent().parent().hide();
and it will go 2 levels up instead of one as described in you solution
Thanks to great people like you Josh I am learning ( slowly)
Many thanks
Jean from France
On 14 mar, 08:27, Josh Powell <seas...@gmail.com> wrote:
> Yes, forget about using ID's in this way. That's something you had to
> do before using jQuery. Think about how your HTML is structured and
> things are named/classed and the order they are in. Take advantage of
> how easy it is to traverse the DOM with jQuery. If yo uhave
>
> <div>
> <a class="choix">link 1</a>
> Description
> </div>
>
> <div>
> <a class="choix">link 2</a>
> Description
> </div>
>
> <div>
> <a class="choix">link 3</a>
> Description
> </div>
>
> and do:
>
> jQuery('.choix').click(function(e) {
> $(this).parent().hide();
>
> });
>
> Then jQuery will iterate through all of the elements on the page with
> a class of 'choix' and attach a click event that hides that links
> parent when clicked on. This keeps your html/javascript much cleaner
> as you do not even need to worry about assigning incrementing id's to
> elements and keeping the numbers matched to another elements id to
> link them.
>
> This is not an exact solution for you, but it should point you in the
> right direction and way of thinking about how to use jQuery.
>
> Josh
>
> On Mar 13, 11:27 pm, macgyver47 <jrl...@wanadoo.fr> wrote:
>
> > What it does:
> > jQuery('.choix1').click(function(){
> > jQuery('#quest1').hide();
> > When you click on either button related to question 1 it just hides
> > the div id="quest1"
> > What I would like to do is something like:
> > for (i=1; i<=6; i++){
> > $("choix " + i ).click function(){
> > $("#quest"+i).hide();
> > }
> > So every time user clicks on any radio button with id="choix1" or
> > choix2 or choix3... it will hide the related div with id="quest1" or
> > quest 2...
> > Any ideas
> > Thanks for help
> > Jean from France
>
> > On 14 mar, 00:57, Josh Powell <seas...@gmail.com> wrote:
>
> > > What this is doing:
>
> > > jQuery('.choix1').click(function(){
> > > jQuery('#quest1').hide();
>
> > > });
>
> > > is looping through every element on the page with a class of 'choix1',
> > > so you could either change all of the elements you want to loop though
> > > classes to choix and then do
>
> > > jQuery('.choix').click(function(){
> > > jQuery(this).parent().hide();
>
> > > });
>
> > > Which will loop through them all and then hide them when either yes or
> > > no is selected or find some other way of identifying every element
> > > that you want to act on. Perhaps use the name field, or if they are
> > > the only radio buttons on the page you can do
>
> > > jQuery(':radio') as the selector.
>
> > > On Mar 13, 2:45 pm, macgyver47 <jrl...@wanadoo.fr> wrote:
>
> > > > Hi
> > > > I am new to jQuery and learning slowly
> > > > Here is the problem
> > > > I have 6 questions each of them has 2 buttons ( yes or no radio
> > > > buttons)
> > > > When user clicks on 1 answer I would like to hide the entire question
> > > > I have achieved to do this for 1 question but no success looping
> > > > through all 6 questions !
> > > > <div id="quest1>
> > > > Question 1
> > > > <input class="choix1" type="radio" name="choix1"
> > > > onclick='q1=1'>Yes<br>
> > > > <input class="choix1" type="radio" name="choix1" onclick='q1=0'>No<br>
> > > > </div>
> > > > <div id="quest2>
> > > > Question 2
> > > > <input class="choix2" type="radio" name="choix1"
> > > > onclick='q1=1'>Yes<br>
> > > > <input class="choix2" type="radio" name="choix1" onclick='q1=0'>No<br>
> > > > </div>
> > > > ...........
> > > > jQuery('.choix1').click(function(){
> > > > jQuery('#quest1').hide();
> > > > });
> > > > This works for 1 item but how can I loop through all all of them
> > > > Thanks for help
> > > > Jean from France
