Hersh Young
Hersh Young

Reputation: 5

jQuery HTML problem

I wrote this:

<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
    <script>
        $("div.productInfo").wrap("<div id='productDetails'></div>");
    </script>
</head>

<body>
     <div class="productInfo">Whatever.</div>
</body>

And it didn't work?. Thanks.

Upvotes: 0

Views: 78

Answers (3)

Šime Vidas
Šime Vidas

Reputation: 185933

Place the SCRIPT elements at the bottom of the page and use a ready handler:

<!DOCTYPE html>

<html>
<head>
    <title>A valid page</title>
</head>
<body>
<div class="productInfo">Whatever.</div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script>
    $(function() {
        $('div.productInfo').wrap('<div id="productDetails"></div>');
    });
</script>
</body>
</html>

Upvotes: 1

JK.
JK.

Reputation: 21808

Looks like you've left out document.ready:

<script>
    $(document).ready(function(){
        $("div.productInfo").wrap("<div id='productDetails' />");
    });
</script>

Upvotes: 1

Trey
Trey

Reputation: 5520

your element hasn't been rendered when your script runs... try this:

<script>
    $(document).ready(function(){
        $("div.productInfo").wrap("<div id='productDetails' />");
    });
</script>

Upvotes: 3

Related Questions