CODEWITHSUNDEEP
javascriptjquery
Budda
Budda

Reputation: 18343

Can't change innerHtml neither with plain JavaScript not with jQuery

Here is source code of the simple page:

<html>
<head>
    <title>Test</title>
    <script src="jquery-1.4.2.js" type=text/javascript></script>
</head>
<body>
    <div id="divText">Original</div>

    <script type="text/javascript">
        var vText = document.getElementById('divText');
        vText.innerText = 'Changed';
        alert(vText.innerHTML);
        $('divText').text = 'Changed with jQuery';
        alert(vText.innerHTML);
    </script>
</body>
</html>

"jquery-1.4.2.js" file is in the same folder.

Both alerts display "original" text, text in browser also "Original"...

What is wrong with my code? Any thoughts are welcome.

Upvotes: 0

Views: 1402

Answers (2)

Matti Lyra
Matti Lyra

Reputation: 13078

As you pointed out in the title you'll be wanting to change the inner html. You'll also need the $('#divText') selector to get to the div with jQuery.

<html>
<head>
    <title>Test</title>
    <script src="jquery-1.4.2.js" type=text/javascript></script>
</head>
<body>
    <div id="divText">Original</div>

    <script type="text/javascript">
        var vText = document.getElementById('divText');
        vText.innerHTML = 'Changed';
        alert(vText.innerHTML);
        alert($('#divText'));
        $('#divText').html('Changed with jQuery');
        alert(vText.innerHTML);
    </script>
</body>
</html>

Upvotes: 2

meder omuraliev
meder omuraliev

Reputation: 186552

1. A quick google ( took me 2 seconds ) reveals text is a function, not a property. Use it like .text('lol') as the example directly from the API.

http://api.jquery.com/text/

2. innerText isn't available in every browser/DOM property.

Upvotes: 3

Related Questions