Custom Layerslider Navigation using API (on WordPress)

I’m trying to create my own navigation for LayerSlider using the API.
This is because I want icons and text which can be updated easily through the backend.

The layerslider documentation recommends the following line of code which I am using:

<a href="javascript:void(0);" onclick="$('#layerslider').layerSlider(2);">Text & Icon</a>

According to this link, it should skip to the second slide when clicked. However, it does nothing.

I haven’t added any jQuery to my template at this stage. This may be the issue? My knowledge on jQuery compared to html and php is minimal so I am struggling with this.

I’ve also found this link, but this uses a list, whereas I’m using an anchor tag with some divs, text and images inside it.

If you need more information to help me troubleshoot this issue, please let me know. I can provide links if need be.

EDIT: I think the issue is that I’m not calling the functions first, because I have no idea how. The code they’ve supplied is below. I’ve tried placing it in script tags and placing it in functions.php without success.

$('#slider').layerSlider({

...

global settings

...

cbInit      : function(element){},  // Calling when LayerSlider loads, returns the LayerSlider jQuery object of the LayerSlider container HTML element.
cbStart     : function(data){},     // Calling when you click the slideshow start button, returns the LayerSlider Data object.
cbStop      : function(data){},     // Calling when click the slideshow stop / pause button, returns the LayerSlider Data object.
cbPause     : function(data){},     // Calling when slideshow pauses (if pauseOnHover is true), returns the LayerSlider Data object.
cbAnimStart : function(data){},     // Calling when animation starts, returns the LayerSlider Data object.
cbAnimStop  : function(data){},     // Calling when the animation of current layer ends, but the sublayers of this layer still may be animating, returns the LayerSlider Data object.
cbPrev      : function(data){},     // Calling when you click the previous button (or if you use keyboard or touch navigation), returns the LayerSlider Data object.
cbNext      : function(data){},     // Calling when you click the next button (or if you use keyboard or touch navigation), returns the LayerSlider Data object.

});