Variables in mootools dollar sign element calls

Question

So I have an element I want to modify (with Fx.Tween, but I suppose it doesn't really matter). However, the element id is dynamically generated, meaning I have to piece it together from some variables.

So let's say... (in js)

name = 'foo';
id = '42';

and I want to access element $('foo_42')... how would I type it out?

$(name+'_'+id) doesn't seem to work, unless I'm doing it wrong...?

Actual example from my code:

var highlight = new Fx.Tween($(accountID+'_'+type+'_'+permission), {
    background-color: #f00;
});

Update: Looks like this question had no answer - my JS in the code sample is just wrong... due to incorrect usage of the Fx.Tween function. Thanks all.

Answer 1

Have you tried

var highlight = new Fx.Tween($(accountID+'_'+type+'_'+permission), {
    background-color: '#f00'
    //                ^^^^^^
});

? The original code you posted isn't valid Javascript. Note that the JS object syntax is not CSS.

The syntax $(name+'_'+id) must work as long as name and id are defined in that scope.

Answer 2

No, that's pretty much exactly it. Mootools won't know if you do $('foo_42') or $('foo' + '_' + '42'), all it will see is foo_42. Just make sure that ID actually exists. If it doesn't, then $() will return null.