Using a switch (materializecss) to change content

[toolman]

Hi,

I am using Materize CSS for some nice form styles.

What I am trying to do is have a switch that switched between contents.

I have the following which works when clicking on a div to swap the content, but I can’t work out how to use the switch instead.

The class I am using to switch content is my-price, but when I add this to the switch, it doens’t work.

Can anyone see what I have done wrong?

This is my fiddle:

jQuery.toggle() (show/hide) - JSFiddle - Code Playground

[toolman]

I’ve managed to work this one out.

I had to do this:

HTML:

<div class="pricing-switch">
									<div class="pricing-toggle">
										<div class="my-price-wrapper">
											<div class="my-price">Show Yearly Prices</div>
											<div class="my-price hidden-toggle">Show Yearly Prices</div>
										</div>
										<div class="switch">
											<label>
												<input type="checkbox">
													<span class="lever"></span>
												</label>
											</div>
										</div>
									</div>

JS:

$(".pricing-toggle span.lever").click(function(){
    $(".toggle-prices .my-price").toggle();
	$(".pricing-toggle .my-price").toggle();
	
});