Question

I am trying to do this process:

1. Find all classes that begin with “i18n_”
2. Capture that class name, then set that class’ .html value to a variable with the same name as the class.

Basically I have a list that gets grabbed off the server with all the strings, beginning with i18n_. For example i18n_t23 = “Back” or something. I want to take the <span class="i18n_t23"></span> and set it’s value to the variable i18n_t23.

At the moment I have a massive list of hand-coded $(“span.i18n_t189”).html(i18n_t189); and it’s getting tiring to have to check if they’re all there. There must be a way to just have it do this automatically.

Thanks!

Answer 1

I would recomend you to slightly change your setup and thus simplify javascript code you’ve got:

<div data-i18="a">a</div>

<div data-i18="b">b</div>

var i18 = { a: 'a2', b: 'b2' }

$('div[data-i18]').each(function(ind, el) {
    var key = $(el).data('i18')
    $(el).html(i18[key])        
});​

// or in case of global variables 

$('div[data-i18]').each(function(ind, el) {
    var key = $(el).data('i18')
    $(el).html(window[key])        
});​

So instead of class i18_something you are setting up custom data attribute data-i18 and put value here.