Существует ли className в Mootools?

Question

Я хочу обновить этот очень простой JS до Mootools 1.2, и это не легко.Эта функция:

function changeclass(x){

                document.getElementById("content").className = "ziclass0";
                document.getElementById("content").className = "ziclass" + x; 

            }

запускается в DOM с помощью:

<div id="someclass">
        a href="javascript: changeclass(0)">Unstyled</a
        a href="javascript: changeclass(1)">link one</a
        a href="javascript: changeclass(2)">link two</a
        a href="javascript: changeclass(3)">link three</a
</div>

для вызова соответствующих CSS-классов, таких как:

.ziclass1 h1{
            color: rgb(142,11,0);
            font-family: Verdana;
            font-size: 2.5em;
            letter-spacing: 0.1em;

        }

и соответственно изменяет макетв:

<div id="content" class="ziclass3"> ...  </div>

Я знаю, что могу добавить событие к триггерам, например:

        $(#someclass.each(function(element,index) {
        element.addEvent('click', function(){
        //some code
        });

Но как мне получить #content classname name?

Черезмассив?

Я немного запутался здесь.

Буду очень признателен за любую помощь, чтобы поставить меня на правильный путь

Answer 1

Это очень основы MooTools. В любом случае, вот как вы изменяете имя класса коллекции элементов:

$$('#container a').each(function(link){
    link.addEvents({
        click: function(e){
            e.stop();

            this.set('class', 'newClassName');

            // to append a class
            // this.addClass('appendThisClass');
        }
    });
});

Вот рабочий пример: http://jsfiddle.net/oskar/9fxxr/

Это все в документации: http://mootools.net/docs/core/Element/Element

Answer 2

Но это не совсем то, что я спрашивал. Триггерный элемент (a) вызывает элемент css, просматривая его номер, расположенный в «href». Пример:

a href="javascript: changeclass(1)">Link One</a

// вызывает все классы CSS с именем .ziclass1 и применяет / добавляет их в «content»

a href="javascript: changeclass(2)">Link Two</a

// вызывает все классы CSS с именем .ziclass2 и применяет / добавляет их в «content»

ИСПОЛЬЗОВАНИЕ

function changeclass(x){
document.getElementById("content").className = "ziclass" + x; 
}

РЕЗУЛЬТАТ: HTML:

a href="javascript: changeclass(1)">Link One</a
 a href="javascript: changeclass(2)">Link Two</a

<div id="content" class="ziclass1">
...
</div>

Вот почему я думал о массиве.

Вокруг этой идеи:

    var myArray = ["0","1","2", etc ...];
    function myFunction() {
    myArray.each(function(value, index, array){
    $(value).addEvent('click',function(event) {                       
    console.log(value); 
// add my class here
     });
    });
    };
    myFunction();

где я получу значение массива, расположенного в href, вот так:

    a href="1">Link one</a
a href="2">Link two</a

и соответственно измените класс. Но я не знаю, как это сделать.