<body>
  <div id="m1">
    <div>내용1_1</div><p>내용1_2</p>
  </div>
  <div id="m2">
    <p>내용2</p>
  </div>
  <div id="m3">
    <span>내용3_1</span><em>내용3_2</em>
  </div>
  <div id="m4">
    <p>내용4</p>
  </div>
</body>
* {
  margin: 5px;
}
$(document).ready(function() {
  $("#m1 > div").add("#m1 > p").css("border", "2px solid red");
  $("#m2").children("p").addBack().css("border", "2px solid orange");
  $("#m3").find("span").css("border", "2px solid yellow").end().find("em").css("border", "2px solid green");
  if($("#m4").children().is("p")) {
    console.log("p 요소가 존재합니다.");
  }
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js