> For the complete documentation index, see [llms.txt](https://docs.wirebootstrap.com/pro-pack/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.wirebootstrap.com/pro-pack/icheck/list.md).

# List

![iCheck List for WireBootstrap](https://795937403-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MGjmp6bcmNAsAEW4hIY%2F-MLArFTcPb110QT6XwCV%2F-MLAuicO8d-8qu7K_A11%2Fimage.png?alt=media\&token=f54fc5f8-6d4b-4eb9-a977-80c78e1a3bc5)

iCheck List for WireBootstrap enhances basic Bootstrap checkboxes and radio buttons.

Use the `icheckList` class to create an instance of the iCheck List for WireBootstrap component.

```javascript
const myList = new wire.icheckList();
```

## Render

Render the component using an HTML `ul` element.

{% tabs %}
{% tab title="JavaScript" %}

```html
<ul id="list"></ul>
<script>
    new wire.icheckList().render("#list", {});
</script>
```

{% endtab %}

{% tab title="Web Components" %}

```html
<wire-icheck-list wr-config=""></wire-icheck-list>
```

{% endtab %}

{% tab title="React" %}

```html
<WireComponent component="wire.icheckList" config={}>
    <ul></ul>
</WireComponent>
```

{% endtab %}

{% tab title="Vue" %}

```html
<ul wire-component="wire.icheckList" v-wire-config=""></ul>
```

{% endtab %}

{% tab title="Angular" %}

```html
<ul wire-component="wire.icheckList" [config]=""></ul>
```

{% endtab %}
{% endtabs %}
