jQuery Checkbox toggle function not working

Question

I'm trying to make a function that changes the color of text when a checkbox is checked. It was working fine, but all of the sudden now it won't work It says that the toggle variable is an undefined expression, but it's just an id tag being stored in it. also, the css changes weren't working, even when the alert would pop up. I would greatly appreciate any info on why this function suddenly broke.

JavaScript, jQuery code:

function estimateToggle(toggle)
{ 
    var toggle = "#" + toggle;
    alert(toggle);

    if  ($(toggle).is(":checked"))
    {
        alert(toggle + " is checked");
        $("'" + toggle + "'").css({'color':'black'});
    }else{
        alert(toggle + " is unchecked");
        $("'" + toggle + "'").css({'color':'#CCCCCC'});
    }

}

HTML code:

<input type="checkbox" class="socialMedia" name="socMedFacebook" id="socMedFacebook" onChange="estimateToggle('socMedFacebook')" value="100">
<label for="socMedFacebook">Facebook</label>
<div align="right" class="socMedFacebook" id="socMedFacebook" name="socMedFacebook">$100</div>

Here is the error that Chrome Console spits out:

Uncaught Error: Syntax error, unrecognized expression: '#socMedFacebook'

You have 2 elements with the same ID. Invalid markup. maybe socMedFacebook-div and socMedFacebook-box ? — elzaer
– elzaer, Commented Oct 23, 2013 at 0:26
I changed it to this $(toggle + "1".css({ Annd it works now. TY so much for your guys' help. — Jeff Walters
– Jeff Walters, Commented Oct 23, 2013 at 0:32

Community · Accepted Answer · 2017-04-12 07:31:16Z

2

ID selector must be unique .

Read Two HTML elements with same id attribute: How bad is it really?

change to

$(toggle).css({

form

 $("'" + toggle + "'") // as your variable toggle  is already string don't wrap quotes around it.

edited Apr 12, 2017 at 7:31

CommunityBot

11 silver badge

answered Oct 23, 2013 at 0:27

Tushar Gupta - curioustushar

57.2k24 gold badges106 silver badges110 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jQuery Checkbox toggle function not working

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related