HTML Code

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>size — click counter</title>
  <style>
    body { font-family: sans-serif; padding: 16px; min-height: 220px; cursor: pointer; }
    span { display: block; margin-bottom: 12px; font-weight: 600; color: #1e3a8a; }
    div { height: 10px; margin: 4px 0; background: #93c5fd; border-radius: 4px; }
    .hint { color: #64748b; font-size: 13px; margin-top: 16px; }
  </style>
</head>
<body>
  <span>Click anywhere to add a div…</span>
  <p class="hint">Uses jQuery 1.12.4 (.size still available).</p>
  <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
  <script>
    $( document.body )
      .on( "click", function () {
        $( this ).append( $( "<div>" ) );
        var n = $( "div" ).size();
        $( "span" ).text( "There are " + n + " divs. Click to add more." );
      })
      .trigger( "click" );
  </script>
</body>
</html>

Lines: 0 | Characters: 0

Live Preview Auto-refresh on Run

jQuery .size() — count divs on click (Try It)