user1712552
user1712552

Reputation: 53

Having problems loading jquery in HTML page

Having trouble loading jquery script in html page. When I debug certain values meant to become red but they don't. What am I doing wrong? FYI here is what I am trying to replicate in visual studio : http://jsfiddle.net/jfriend00/GAwrB/

    <html>
<head>
<title></title>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
    $(".colorMe td").each(function() {
        var valueInTd = $(this).text();
        if (valueInTd < 3000) {
            $(this).css('background-color', '#F00000');
        }
    });
});

</head>
<body>
 <table class="colorMe">
<tr><td>2000</td><td>3500</td></tr>
<tr><td>3000</td><td>2500</td></tr>
<tr><td>4000</td><td>4500</td></tr>
</table>​
  </body>
</html>

Upvotes: 0

Views: 91

Answers (4)

themazz
themazz

Reputation: 1137

Here is another example:

http://jsfiddle.net/GAwrB/92/

I found a problem on the jQuery version. You should try the latest version and use the onDomReady instead of onLoad, it worked for me with your example.

Regards

Upvotes: 0

Jasper
Jasper

Reputation: 75993

I'm not sure what you're trying to do, looks like you're mixing an IIFE (immediately-invoked-function-expression) and a regular function declaration.

If you just paste your own code into JSFiddle you can see the errors: http://jsfiddle.net/f6sH6/

Here is the error I get: Uncaught ReferenceError: rr is not defined

Looks like you tried to over complicate the issue. This works fine:

$(function () {
    $(".colorMe td").each(function() {
        var val = parseInt(this.innerHTML, 10);
        if (val < 3000) {
            this.style.backgroundColor = "#F00000";
        }
    });
});

Upvotes: 1

Dan Breen
Dan Breen

Reputation: 12924

2 problems I can see. 1) your function declaration for rr is inside parenthesis so it will not be reachable outside of those, 2) the each function you're calling is using improper syntax. It should look like:

$(".colorMe td").each(function() {
    // ... code
});

Upvotes: 0

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114347

jQuery syntax is slightly different:

$(".colorMe td").each(
    var val = parseInt($(this).text(), 10);
    if (val < 3000) {
        $(this).css('background-color','#F00000');
    }
)

Upvotes: 0

Related Questions