problem with show

[IntegrityWebDev]

I'm not sure if I have this formed incorrectly or if there is a problem elsewhere. I am rather new to jQuery so this is probably simple:

Here is an HTML snippet:

<div class="showanswersnow"><a href="#">Click here to show the answers now.</a></div>

and here is a jQuery snippet:

$('.showtheanswers').click(function() {
$('.ouranswer').show();
}); 

But when I click this it doesn't display the .ouranswer div.

In another chunk of code i have a countdown time and when it gets to zero the jQuery executes:

$('.ouranswer').show();

and it works there.

Any thoughts?

[JAB Creations]

The first problem is that you're using a framework which generates a ton of overhead and is completely unreliable by using proprietary methods such as innerHTML (and you won't know it until you reach a certain level which is difficult to achieve if you're using a framework to begin with). Stick to real JavaScript.

Here are a couple functions that I use to change the class of an element and to toggle the class of an element...

- John

Change Class

function change(id,newClass)
{
 if (document.getElementById(id)) {document.getElementById(id).className=newClass;}
 else if (id) {id.className=newClass;}
 else {alert('Error: the id \''+id+'\' was not found or has not yet been imported to the DOM.\n\nNew class intended: '+newClass);}
}

// change('element_id','new_style');
// ||
// var s = document.getElementById('sidebar');
// change(s,'new_style');

Toggle Class

function change_toggle(id,c1,c2)
{
 if (document.getElementById(id))
 {
 if (document.getElementById(id).className==c2) {change(id,c1);}
 else {change(id,c2);}
 }
 else {alert('Error: the id \''+id+'\' was not found or has not yet been imported to the DOM.');}
}

//change_toggle('background_color_div','white','grey');

[penders]

Is the onclick event being assigned to the (correct) element? If you put an alert('Hello World') inside the event, does it alert? Is there some confusion over the inner anchor? Should the click event not be applied to this anchor, rather than the outer DIV? Since I guess the anchor is for the benefit of keyboard users?

[ctoz]

<div class="showanswersnow">
and
$('.showtheanswers')
don't match.

[penders]

@ctoz: Eyes of a hawk! :)

[IntegrityWebDev]

Thanks for your help. Turns out the section I needed this for was done away with on the site so it is no longer needed.

[ctoz]

" a framework which generates a ton of overhead and is completely unreliable"

2¢
The overhead pain's more or less done with after the first load: and you can organise your code so that the viewer has content to look at/read while the library's loading. I'm a slow learner, not too interested in bells'n'whistles, but I've found jQuery's ajax functions and its callbacks—which allow for precise timing and sequencing—really easy to implement. For me, it was either jQ or some other library, or having to learn Flash, and Flash looked like a more closed system than jQ...