$("a[id=^='toggle_effect_button']").click(function() {
var id = this.id.replace("toggle_effect_button", "");
$("#toggle_effect" + id).toggle('blind',500);
return false;
});
On Oct 27, 12:06 pm, Simon Morris <moz...@gmail.com> wrote:
> Hello,
>
> I'm new to jQuery and would appreciate some help with Selectors.
>
> At the moment I know enough to write some clunky repetitive code that
> violates the DRY (Don't Repeat Yourself) principle
>
> // Toggle Divs
> $("a#toggle_effect_button").click(function(){
>
> $("#toggle_effect").toggle('blind',500);
> return false;
> });
>
> $("a#toggle_effect_button2").click(function(){
>
> $("#toggle_effect2").toggle('blind',500);
> return false;
> });
>
> $("a#toggle_effect_button3").click(function(){
>
> $("#toggle_effect3").toggle('blind',500);
> return false;
> });
>
> $("a#toggle_effect_button4").click(function(){
>
> $("#toggle_effect4").toggle('blind',500);
> return false;
> });
>
> $("a#toggle_effect_button5").click(function(){
>
> $("#toggle_effect5").toggle('blind',500);
> return false;
> });
>
> $("a#toggle_effect_button6").click(function(){
>
> $("#toggle_effect6").toggle('blind',500);
> return false;
> });
>
> $("a#toggle_effect_button7").click(function(){
>
> $("#toggle_effect7").toggle('blind',500);
> return false;
> });
>
> $("a#toggle_effect_button8").click(function(){
>
> $("#toggle_effect8").toggle('blind',500);
> return false;
> });
>
> How can I boilerplate code like this? They all refer to similar links that
> controller the jQueryUI toggle action on DIV containers.
>
> If I assign a class to the "toggle_effect_button" hyperlinks is there a way
> to locate the correct DIV and toggle it?
>
> Or am I already doing this in the most concise way?
>
> Thanks for your help
>
> ~sm
