add extra text to a div using jquery [Archive]

isntworkdull

07-29-2010, 09:19 PM

Hi all

This might be impossible, but i'm sure i read some where before that jquery could add text to a page.

Basically i want to add a short snippet of text to the below line:

<div class="prodprice"><strong>Price:</strong> <span class="price" id="pricediv0">£33.99</span> </div>

i simple want to add the text "inc. Vat" after the price in the above code. However ideally i'd like a different style added to it.

If anyone can advise on how i could go about this with jquery would be great

thanks
James

IGNORE THIS MESSAGE, SORTED THE PROBLEM... CANT SEE HOW TO DELETE THREAD...

azoomer

07-29-2010, 10:20 PM

I see you figured it out already, but i'm gonna post my suggestion anyway in case somebody else wonder how it can be done.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Inc.Vat</title>

<style type="text/css">
.vat {
color: blue;
font-weight: bold;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:12px;
font-style:italic;
padding-left: 6px;
}
</style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script type="text/javascript">
jQuery(document).ready(function($) {
$('.prodprice').append('<span class="vat">inc. Vat</span>');
});
</script>

</head>
<body>
<div class="prodprice"><strong>Price:</strong> <span class="price" id="pricediv0">£33.99</span> </div>
</body>
</html>