Ytukyg

I am attempting to change the class of a checkbox parent element (span) to checked. I'm following these steps but am getting the error:

$checkbox.parentNode.addClass is not a function
at HTMLInputElement.

Here is the website

Here is the JS code:

<script type="text/javascript">

        document.getElementById("generateVin").addEventListener("click", function(){



                var $checkbox = document.querySelectorAll("input[type='checkbox']")[1];

                var $span=$checkbox.closest("span");

                $checkbox.parentNode.addClass("checked");



});

        </script>

You're mixing jQuery with vanilla JavaScript. .addClass() is a jQuery method, meaning it can only be called on jQuery elements.

$checkbox.parentNode is not a jQuery element, but rather a standard JS element.

If you're committed to using jQuery, then it's highly suggested that you go "all the way", rather than going back and forth. The code would look more like this:

$("#generateVin").on("click", function() {

    var $checkbox = $("input[type=checkbox]").eq(1);

    var $span = $checkox.closest("span");    //This doesn't seem to be needed

    $checkbox.parent().addClass("checked");

});

• Used jQuery selector syntax to target generateVin: $("#generateVin")




• Used jQuery event handlers: .on("click", function() { ... })




• Converted $checkbox to a jQuery element by using jQuery selector and .eq(): var $checkbox = $("input[type=checkbox]").eq(1);




• Used jQuery's parent() in place of parentNode