why doesn't Jquery work, when js does?

Question

i am learning Jquery and i can't figure out why none of the JQuery lines execute, while javascript lines do. When I open it whith browser, the console shows"hello world" and "undefined". If i put these lines in the console, they are executed as expected. here is my code :`

<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8">
    <title> cim </title>
       <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"> $('div:nth(0)').attr("class","marked") </script>
    <script>
        $(document).ready(funk())
        function funk() {
        $("div").css("border", "3px solid red");
            console.log("hello world");
            $("div:nth(0)").attr("class","marked");
            console.log($("div:nth(0)").attr("oo"));
            $("div").append("LLLLLLLLLLLLLLLLLLLLL");
        }
    </script>


</head>
<body>
<div oo="ooo">
<p> blah </p>
<p> blah <br></p>
<p>blah</p>
</div>
<div>
    <p> asd</p>
    <p> asd</p>
    <p > asd</p>
</div>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
</body>
</html>enter code here`

Why are you including 2 different versions of jQuery in your page? — Pointy
– Pointy, Commented Apr 9, 2016 at 21:38
Also: $(document).ready(funk); not funk() - you're calling the function when you include (). — Pointy
– Pointy, Commented Apr 9, 2016 at 21:38
Also, don't put any code in the ></script> tags for the call to jQuery. Move $('div:nth(0)').attr("class","marked") to the script where the rest of your code is, within the ready function, — Andy
– Andy, Commented Apr 9, 2016 at 21:39

Gabriele Petrioli · Accepted Answer · 2016-04-09 21:42:16Z

4

A few of issues

You are including two versions of jQuery (no need for that)
You cannot run code and link to an external file in one script element. So the code inside the first one will be ignored
you immediately execute the func method and the DOM is not ready so all the elements are not found
there is not :nth selector. Either :nth-child or :eq

What you need is

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script>
    $(document).ready(funk);
    function funk() {
        $("div").css("border", "3px solid red");
        console.log("hello world");
        $("div:nth(0)").attr("class","marked");
        console.log($("div:eq(0)").attr("oo"));
        $("div").append("LLLLLLLLLLLLLLLLLLLLL");
    }
</script>

answered Apr 9, 2016 at 21:42

Gabriele Petrioli

197k35 gold badges275 silver badges331 bronze badges

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

Comments

Shiran Dror · Accepted Answer · 2016-04-09 21:41:02Z

1

change $(document).ready(funk()) to this $(document).ready(function () {funk();});

answered Apr 9, 2016 at 21:41

Shiran Dror

1,4801 gold badge25 silver badges37 bronze badges

1 Comment

Sebastian Simon Over a year ago

Or just $(document).ready(funk). There’s no point in over-complicating it.

Collectives™ on Stack Overflow

why doesn't Jquery work, when js does?

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related