Изменение класса элемента в зависимости от разрешения экрана

[funfot]

Ребята, всем привет!

Занимаюсь версткой проекта, адаптивного, и потребовалось сделать так, чтобы при разрешении экрана менее 700 пикселей, у одного элемента менялся класс. (при этом у него задано 2 класса, что-то типа: class="one two")

Изменить нужно именно второй класс "two".
Через @media - не вариант, мне конкретно нужно присвоить новый класс элементу.

Понимаю, что это нужно сделать средствами js, но как - ума не приложу..

Очень буду рад за подсказку!
Понимаю, что вопрос нубовский, но очень надеюсь на вашу помощь..

[d.skuratovich]

funfot, наверное как-то так

( function ( $, global ) {
	'use strict';

	$( global ).resize( function () {
		if ( global.screen.width < 700 ) {
			$( '.one' ).removeClass( 'two' ).addClass( 'three' );
		}
	} );
} ( jQuery, window ) );

Но я бы на твоем месте так не делал, а добавил три класса, а вот через @media уже менял стили. JS это не выход

[Pavel M.]

screen.width сообщает нам об экране, а не о реальном окне браузера (может быть не на полный экран открыт, в андроиде тоже уже может на некоторых устройствах окно браузера занимать только часть экрана)

так, что screen.width использовать не надо вместо медиа запросов

лучше почитать здесь http://learn.javascript.ru/metrics-window

[d.skuratovich]

Pavel M., никто про браузер и не говорил. Человек конкретно спросил про ширину экрана, я ему ответил. Если бы он спросил про окно браузера я бы написал про окно