---
name: "up.$compiler"
area: "API"
kind: "JavaScript function"
parent: "up.script module"
visibility: "deprecated"
url: "https://unpoly.com/api/up.$compiler"
---
<nav aria-label="Unpoly docs">[All docs](https://unpoly.com/index.md) · [up.script module](https://unpoly.com/api/up.script.md)</nav>

# up.$compiler(selector, [options], compiler)

**This feature has been deprecated**. Use [`up.compiler()`](https://unpoly.com/api/up.compiler.md) with a callback that wraps the given native element in a jQuery collection.

Load [`unpoly-migrate.js`](https://unpoly.com/changes/upgrading.md) to polyfill deprecated features.

Registers a function to be called when an element with the given selector is inserted into the DOM. The function is called with each matching element as a [jQuery object](https://learn.jquery.com/using-jquery-core/jquery-object/).

If you're not using jQuery, use [`up.compiler()`](https://unpoly.com/api/up.compiler.md) instead, which calls the compiler function with a native element.

## Example {#example}

This jQuery compiler will insert the current time into a `<div class='current-time'></div>`:

```js
up.$compiler('.current-time', function($element) {
  let now = new Date()
  $element.text(now.toString())
})
```

---

## Parameters {#parameters}

### selector {#selector}

(required)

The selector to match.

Type: string

### [options] {#options}

(optional)

See [`options` argument for `up.compiler()`](https://unpoly.com/api/up.compiler.md#parameters).

Type: [Object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects)

### compiler {#compiler}

(required)

The function to call when an element matching `selector` is inserted.

Up to three arguments can be accepted:

1. The newly inserted `element` matching the selector
2. Any [data attached to the element](https://unpoly.com/learn/data.md)
3. [Meta information](https://unpoly.com/learn/enhancing-elements.md#meta) about the current render pass

The function may return a [destructor function](https://unpoly.com/learn/enhancing-elements.md#destructor) that is called before it is removed from the DOM. The destructor function is called with the compiled element.

The compiler function can be [`async`](https://unpoly.com/api/up.compiler.md#async).

Type: Function($element, [data](https://unpoly.com/learn/data.md))