How Can I Make These Nice Checkboxes AJAX Post Like This Other Button?

I have pretty (but non-functional) checkboxes beside a normal Submit button (that works fine on my server).

How can I make the pretty checkbox initiate an AJAX Post?

I've tried every combination I could think of.

<form  id="form" action='result.php' method='post'>

<ul class="listview checkbox-strip">
    <li><!-- li helps with formatting -->

        <label class="checkbox">
            <input name="quantity" value="one" type="checkbox">
            <input name="prod_id" value="62" type="hidden">
            <span class="label-text">Orange</span>
        </label>
    <BR>
        <label class="checkbox">
            <input name="quantity" value="5" type="checkbox">
            <input name="prod_id" value="62" type="hidden">
            <span class="label-text">Yellow</span>
        </label>


        <label class="checkbox">
        <input name="quantity" value="eighth" type="checkbox"></label>
        <input type=hidden name="prod_id" value=10>
        <input type="button" value="This Button Works on my server" id="submit">
</li>
</form>
<div id = "container"></div>

No error yet, just not able to trigger the post.

Here's a fiddle of it where everything works but the post. The post works on my server.

https://jsfiddle.net/FredSmith/wktvhy60/21/

Thanks for your help