isotope/_posts/docs/2010-12-04-methods.mdown

---

title: Methods
category: docs
layout: doc
related: methods
toc:
  - { title: addItems, anchor: additems }
  - { title: appended, anchor: appended }
  - { title: destroy, anchor: destroy }
  - { title: insert, anchor: insert }
  - { title: layout, anchor: layout }
  - { title: option, anchor: option }
  - { title: reLayout, anchor: relayout }
  - { title: remove, anchor: remove }

---

Isotope offers several methods to extend functionality. Isotope's methods follow the jQuery UI pattern.

{% highlight javascript %}

$('#container').isotope( 'methodName', [optionalParameters] )

{% endhighlight %}

## addItems

{% highlight javascript %}

.isotope( 'addItems', $content, callback )

{% endhighlight %}

Adds elements to the pool of item elements of the container, but does sort, filter or layout. See [Adding items](adding-items.html) for more details. The argument within the callback is the group of elements that were added. 

[**See Demo: Adding items**](../demos/adding-items.html)

## appended

{% highlight javascript %}

.isotope( 'appended', $content, callback )

{% endhighlight %}

Adds elements via `addItems` method, then triggers `layout` just for those new elements. Useful for Infinite Scroll. See [Adding items](adding-items.html) for more details.

[**See Demo: Adding items**](../demos/adding-items.html)

## destroy

{% highlight javascript %}

.isotope( 'destroy' )

{% endhighlight %}

Removes Isotope functionality completely. Returns element back to pre-init state.

## insert

{% highlight javascript %}

.isotope( 'insert', $content, callback )

{% endhighlight %}

Appends elements to container, adds items to via `addItems` method, and then triggers `reLayout` method so new elements are properly filtered, sorted and laid-out. See [Adding items](adding-items.html) for more details.

[**See Demo: Adding items**](../demos/adding-items.html).

## layout

{% highlight javascript %}

.isotope( 'layout', $content, callback )

{% endhighlight %}

Positions specified elements in layout.

`layout` will only position specified elements, and those elements will be positioned at the end of layout. Whereas `reLayout` will position all elements in the Isotope widget.

## option

{% highlight javascript %}

.isotope( 'option', options )

{% endhighlight %}

Modifies options for plugin instance.

## reLayout

{% highlight javascript %}

.isotope( 'reLayout', callback )

{% endhighlight %}

Resets layout properties and lays-out every item element.

[**See Demo: reLayout**](../demos/relayout.html)

## remove

{% highlight javascript %}

.isotope( 'remove', $content )

{% endhighlight %}

Removes specified elements from Isotope widget and the DOM.