$(function () {
  /*
    変更と取得
  --------------------------------------- */

  // text() ・・・ テキストの変更と取得
  $('#item1').text('textメソッドで変更したぜ'); // 変更

  var text = $('#item2').text(); // 取得
  $('#text1').text(text);

  // html() ・・・ HTMLの変更と取得
  $('#item3').html('<em>htmlメソッドで</em>変更したぜ'); // 変更

  var text = $('#item4').html(); // 取得
  $('#text2').html(text);

  /*
    要素を追加するメソッド
  --------------------------------------- */

  // prepend() ・・・ 子要素の先頭に追加
  $('ul').prepend('<li>prependで追加</li>');

  // append() ・・・ 子要素の末尾に追加
  $('ul').append('<li>appendで追加</li>');

  // before() ・・・ セレクタで指定した要素の手前に追加
  $('#item3').before('<li>beforeで追加</li>');

  // append() ・・・ セレクタで指定した要素の後に追加
  $('#item4').after('<li>afterで追加</li>');
});
