# .size()

## size ( ) Returns: Integer version added: 1.0

Description: Return the number of elements in the jQuery object.

The `.size()` method is deprecated as of jQuery 1.8. Use the `.length` property instead.

The `.size()` method is functionally equivalent to the `.length` property; however, the `.length` property is preferred because it does not have the overhead of a function call.

Given a simple unordered list on the page:

    <ul>
      <li>foo</li>
      <li>bar</li>
    </ul>

Both `.size()` and `.length` identify the number of items:

    alert( "Size: " + $( "li" ).size() );
    alert( "Size: " + $( "li" ).length );

This results in two alerts:

`Size: 2`

`Size: 2`

## Examples:

#### Example: Count the divs. Click to add more.

    <!doctype html>
    <html lang="en">
    <head>
      <meta charset="utf-8">
      <title>css demo</title>

      <style>

      body {
        cursor: pointer;
        min-height: 100px;
      }
      div {
        width: 50px;
        height: 30px;
        margin: 5px;
        float: left;
        background: blue;
      }
      span {
        color: red;
      }

      </style>

      <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    </head>
    <body>

    <span></span>
    <div></div>

    <script>

    $( document.body )
      .click(function() {
        $( this ).append( $( "<div>" ) );
        var n = $( "div" ).size();
        $( "span" ).text( "There are " + n + " divs. Click to add more." );
      })

      // Trigger the click to start
      .click();

    </script>

    </body>
    </html>

#### Demo: