jQuery button refuses to style

Question

I am trying to style my jQuery buttons according to the instructions on the website but it won't work. I followed the instructions here: http://jqueryui.com/button/#checkbox

What am I doing wrong? Here is my code: http://jsfiddle.net/YrNxy/

HTML

    <div style="padding-bottom: 10px; padding-top: 10px;">
      <div class="modal_field">Day <strong style="color:#A00">(required)</strong>:</div>
      <div class="format">
        <input type="checkbox" class="check1" />
        <label for="check1">Mon</label>
        <input type="checkbox" class="check2" />
        <label for="check2">Tues</label>
        <input type="checkbox" class="check3" />
        <label for="check3">Wed</label>
        <input type="checkbox" class="check4" />
        <label for="check4">Thu</label>
        <input type="checkbox" class="check5" />
        <label for="check5">Fri</label>
      </div>
    </div>​

JS

$(function() {
        $( ".check" ).button();
        $( ".format" ).buttonset();
    });​

Answer 1

The problem is your inputs are not properly setup. I fixed the code on JSBin for you. Notice the class got changed to id for the checkbox (for = id or name for label & checkbox).

http://jsbin.com/akulas/1/