<div id="myDiv"><p>안녕하세요~~!!!</p></div>

<button onclick="getContents()">내용 가져오기</button>
<button onclick="changeContent()">내용 변경</button>
<button onclick="addContent()">내용 추가</button>
<button onclick="removeContent()">내용 삭제</button>

// 내용 가져오기
function getContents() {
  var divContent = document.getElementById("myDiv").innerHTML;
  alert(divContent);
}

// 내용 변경하기
function changeContent() {
  var newContent = "<p><b>새로운 내용으로 변경</b></p>";
  document.getElementById("myDiv").innerHTML = newContent;
}

// 내용 추가하기
function addContent() {
  var additionalContent = "<p>내용 추가</p>";
  document.getElementById("myDiv").innerHTML += additionalContent;
}

// 내용 삭제하기
function removeContent() {
  document.getElementById("myDiv").innerHTML = "";
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.