CSSのところで、同じような設定をするためにグルーピングしたり、ある特定の場所を設定したりするときに
classという属性を使ったり、idというタグを使ったりします。
複数の要素からなる（１つでもいいですが）グループのタグがclassで、
唯一無二の要素を設定するタグがidとなります。

今回のサンプルとなるindex.htmlの中でも

  <h1 id="title">タイトル</h1>
  <p class="sample">
    本文はここに入ります。<br />
	<span class="red">赤い文字</span>
  </p>
  <p class="sample">
    二つ目の段落です。
  </p>

このように書いているところがあります。
idは「title」という名前が着いている見出し１のエリアがありますし、
classは、「sample」という名前のグループの段落が２つありますね。

css及びjQueryでは、
idを表す記号は「＃（ハッシュ）」で表現し
classを表す記号は「.（ドット）」で表現します。

CSSの場合は、

/* idがtitleのDOMの設定 */
#title {
 color: black;
}

/* classがsampleのDOMの設定 */
.sample {
 color: pink;
}

このような書き方になりますし、jQueryの場合は

/* idがtitleのDOMの設定 */
$('#title').css({
 color: 'black';
});

/* classがsampleのDOMの設定 */
$('.sample').css({
 color: 'pink';
});

となります。

今回は練習で、idがsanbanとなっている段落のCSSを「文字を太字にする」ように変更するjQueryを表記してみましょう。

// idがtitleのDOMの設定 
$('#sanban').css({
 'font-weight': 'bold',
});

// もしくは 
$('#sanban').css({
 fontWeight : 'bold',
});

このように書くことが出来ます。

属性付きの要素ノードの表現

上の表現では、classタグの設定は、classがsampleとなっている要素ノードはすべて変更されることになります
ただ、同じクラス名は、同じ要素ノードにする必要はありません。
仮にこのクラスに属するノードは太字にするfutojiというクラスを作成したとしたばあい、別にp要素でもh1要素でもdiv要素でもこのclassを使用することは可能です。
ただ、同じfutojiクラスでもp要素ののものだけをjQueryで設定したい、変更したい、処理したいということがありえます。
このときは、
要素名.クラス名
　（要素名と「.」とクラス名の間にはスペースは入れてはいけません）
という書き方をします。

※要素名と「.」の間にスペースを空けてしまうと、意味が変わってくる（p要素の中に（子孫ノードとして）設定されている名前がクラス名の要素 ）ので気をつけましょう