CSSとJavascript（jQuery）の使い分け方

こんにちは。
CSS、Javascript（jQuery含む）を覚えたての初心者です。

CSSファイルはHTMLの装飾、JavaScriptはHTMLで作ったページに「動き」をもった内容を表示できます。
しかし、Javascriptファイルでは、jQueryファイルと一緒に使い、例えば
$("function(){});").css("color","red"); などを使うことで
CSSファイルと同じように、文字を大きくしたり背景に色をつけたりすることができます。

これでは極論を言ってしまえば、$("function(){});").css("color","red"); 　をつかった.jsファイルを作りこむことでCSSが不要になってしまいます。しかし、CSSはどのウェブページでも必ず使われているものです。

JavaScript（とjQuery）を使ってホームページを作っている方は、
CSSとJavaScript（とjQuery）との使い分けを　どのようにしているのでしょうか？

宜しくお願い致しますm(_ _)m

No.1 ベストアンサー 回答者： hitomura 回答日時： 2015/08/31 02:09

CSS と JavaScript の使い分けはあなた自身が答えを書いてるじゃないですか、

> CSSファイルはHTMLの装飾、JavaScriptはHTMLで作ったページに「動き」をもった内容を表示
と。

確かに JavaScript で CSS を操作することは可能です。しかしそれは JavaScript での何らかの処理の結果をユーザーに通知するためのもので、処理によって変化しない箇所や初期状態の装飾を設定するものではありません（ただし初期状態としての要素の不可視化は例外：JavaScript を切った状態では不可視な要素へのアクセスができなくなるため）。

また、実際の表示の際 JavaScript で装飾を行うと、まずブラウザのデフォルトの装飾がページに施され、そののちに JavaScript による装飾変更が行われるため二度手間になります。それに対して CSS による装飾を行うと、ブラウザのデフォルトの装飾方法を CSS が修正してそれをページに適用するだけで済みます。