Jquery .show() and .hide() or even .css({"display":"none"}); not working in firefox?

For some odd reason the part where objects are shown and hidden in my script doesn't seem to be working. I'm not sure if its the fact firefox doesn't like that or whether its the function-based code I have (to save duplicating lines of code)?

There is a working example here and the javascript is here

** Here is the jquery **

$(document).ready(function(){

totUpPrices();
checkBedType();
checkHeadboardOption();

$('.bedtype_price')开发者_如何学C.click(function()
{
    checkBedType(); 
});

$('.headboard_option').click(function()
{
    checkHeadboardOption();
});

$('#bed-floater').scrollFollow({ offset:10 });
$('.texture').click(function()
{

    $('.texture').removeClass("checked");
    $('.texture').children("input").attr("checked","");

    $(this).addClass("checked");
    $(this).children("input").attr("checked","checked");

});

$('.pricechanger_auto').change(function()
{
    totUpPrices();
});

$('.bed-width-single').change(function()
{
    if($(this).val()=="2' 6\"" || $(this).val()=="3'")
    {
        $('.pocketmatic-mattress').attr("disabled","");
    }
    else
    {
        $('.pocketmatic-mattress').attr("disabled","disabled");
        if($('.pocketmatic-mattress').parent("select").val()=="Pocketmatic")
        {
            $('.pocketmatic-mattress').parent("select").children("option[value='']").attr("selected","selected");
        }
    }
});

$('.bed-width-twin').change(function()
{
    if($(this).val()=="4' 6\"" || $(this).val()=="6'")
    {
        $('.pocketmatic-mattress').attr("disabled","");
    }
    else
    {
        $('.pocketmatic-mattress').attr("disabled","disabled");
        if($('.pocketmatic-mattress').parent("select").val()=="Pocketmatic")
        {
            $('.pocketmatic-mattress').parent("select").children("option[value='']").attr("selected","selected");
        }
    }
});

function totUpPrices()
{

    var totalprice = 0;

    // Check Type of bed prices
    var objs = $('.bedtype_price');
    $.each(objs, function(index, value) {

        if($(value).attr("checked"))
        {
            totalprice = totalprice + parseInt($(value).attr("cost"));
        }

    });

    // Check Delivery Options
    var objs = $('.deliveryoptions_price');
    $.each(objs, function(index, value) {

        if($(value).attr("checked"))
        {
            totalprice = totalprice + parseInt($(value).attr("cost"));
        }

    });

    // Check Dropdown Prices
    var objs = $('.select_price');
    $.each(objs, function(index, value) {

        newvalue = $(value).attr("value");
        $.each($(value).children("option"), function(i, l){
            if($(this).attr("value")==newvalue)
            {
                totalprice = totalprice + parseInt($(this).attr("cost"));
            }

        });

    });
    $('#totalincvat').text(totalprice);
}

function checkBedType()
{
    var objs = $('.bedtype_price');
    var checkedType = '';
    $.each(objs, function(index, value) {

        if($(value).attr("checked"))
        {
            checkedType = $(value).val();
        }

    });
    if(checkedType == "Single Bed")
    {
        $('.show_with_single').show();
        $('.show_with_twin').hide();
        $('.changeOnTwin').text("Would you like a headboard?");
    }
    else
    {
        $('.show_with_twin').show();
        $('.show_with_single').hide();
        $('.changeOnTwin').text("Would you like headboards?");
    }
}

function checkHeadboardOption()
{
    var objs = $('.headboard_option');
    var checkedType = '';
    $.each(objs, function(index, value) {

        if($(value).attr("checked"))
        {
            checkedType = $(value).val();
        }

    });
    if(checkedType == "Yes")
    {
        $('.headboard-options').show();
    }
    else
    {
        $('.headboard-options').hide();
    }
}

});

All help appreciated

Your HTML does not validate. See here,

http://validator.w3.org/check?uri=http%3A%2F%2Fbed-adjustable.co.uk%2Fbuild-a-bed%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

The very first line of your html is already invalid.

Sorry your first line is ok, I didnt know that was HTML5, though it is pretty early to do HTML5.

I didn't follow your links (see my comment on your question), but fundamentally, Firefox has no issue with jQuery's show and hide or setting display: none in CSS, so it is a code problem.

Could start with validating your XHTML, http://validator.w3.org/check?uri=http://bed-adjustable.co.uk/build-a-bed/&charset=(detect+automatically)&doctype=Inline&group=0