Question

I am trying to use the Jquery UI to use radio inputs as buttons. This is the code I’ve got so far:

    <div id="time-buttons"
    <input type="radio" id="radio1" name="radio" /><label for="radio1">Choice 1</label>
    <input type="radio" id="radio2" name="radio" checked="checked" /><label for="radio2">Choice 2</label>
    <input type="radio" id="radio3" name="radio" /><label for="radio3">Choice 3</label>
    <input type="radio" id="radio4" name="radio" /><label for="radio4">Choice 4</label>
    <input type="radio" id="radio5" name="radio" /><label for="radio5">Choice 5</label>
    </div>

and the javascript:

   $( "#time-buttons" ).buttonset();

The problem that I have is that radio1 is not being changed into a button, but all of the others are. When I’ve looked inside Firebug, it looks as though the tag isn’t present for Choice 1. Does anyone know why this is happening?

Thanks for any help

Edit: Sorry, just realised a very stupid mistake…basically I missed off the closing div >. Stupid me!

Answer 1

As the highlighter probably helped you figure out, your first <div> tag isn’t complete. Errors like this are easier to see in an editor that does syntax highlighting, and are often reported in Chrome’s console (in the developer tools).