#### Basic

    <div class="transition_target"></div>

    $(".transition_target").transition({
      always: true
    }, function() {
      // Tranition complete...
    }).addClass("active");

    .transition_target {
      background: black;
      transition: background 0.25s;
    }

    .transition_target.active {
      background: blue;
    }

#### Delegation

    <div class="transition_target">
    	<div class="transition_child"></div>
    </div>

    $(".transition_target").transition({
      always: true,
      target: ".transition_child"
    }, function() {
      // Tranition complete...
    }).addClass("active");

    .transition_target .transition_child {
      background: black;
      transition: background 0.25s;
    }

    .transition_target.active .transition_child {
      background: blue;
    }

#### Property

    <div class="transition_target"></div>

    $(".transition_target").transition({
      always: true,
      property: "height"
    }, function() {
      // Tranition complete...
    }).addClass("active");

    .transition_target {
      background: black;
      height: 10px;
      transition:
        background 0.25s linear 0s,
        height 0.25s linear 1s;
    }

    .transition_target.active {
      background: blue;
      height: 30px;
    }