Javascript not working when launch in chrome



  • Hi Everyone,

    I have been learning web programming for the past year as a hobby and love NP++. However I have some issues with certain Javascript functions working and some that do not.

    I am having real trouble in getting this particular function t run when launched in chrome. From research the coding looks correct but it just won’t work…can someone please give me some advise. I do not know if it a setting or a feature or a plugin that is not set in NP++.

    Any help would be most appreciated…below is the code for the particular that does not work in NP++. I have many other pages to my site with javascript working fine but not this.

    <!DOCTYPE html>
    <html>
    <head>
    <title>Test Page</title>
    <meta name=“viewport” content=“width=device-width, initial-scale=1”>
    <meta charset=“UTF-8”>
    <script src=“https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js”></script>
    <script>
    $("#carQuestion span").click(function(){
    $("#carQuestion span").removeClass(‘correct’);
    $(this).addClass(‘correct’);
    });
    </script>
    <style>
    .correct { color: red; }
    span:hover { cursor: pointer; }
    </style>
    </head>
    <body>
    <p id=“carQuestion”>What Car is most like me?
    <br><span class=“correct”>Ferrari</span>
    <br><span>Limousine</span>
    <br><span>SUV</span>
    <br><span>Stationwagon</span>
    </p>
    </body>
    </html>



  • this is not a notepad++ issue, it is a javascript/jquery question.

    The DOM element refrenced by $("carQuestion span") is not yet defined when the script is run so the click method is not applied to any DOM element.

    You must either wrap your script with $(document).ready(function(){ ... }) or move your script tag to just before </body>

    https://api.jquery.com/ready/


Log in to reply