Make div toUpperCase()

I've been looking for a script that makes all text in every div to uppercase letters. I found this script:

<script type="text/javascript" src="Script/jquery-1.3.2.js"></script>
<script type="text/javascript">

         $(document).ready(function(){
            $("div").text($("div").开发者_JAVA百科text().toUpperCase());
    });
</script>

From:here

However, this script takes every div, and adds it onto the previous and repeats it down the document... it's hard to explain.

I would think that

$("div").text().toUpperCase();

alone should work... but it doesn't.

I feel like this should be really simple...

Any and all help is appreciated!

EDIT

I cannot do this with IDs! It has to be with the actual elements.

The problem here is that your inner call to $('div') is iterating over every div, getting the text, changing it to upper case, and setting it to the current element in the outter $('div') iteration. You need to loop through each div, get it's text, and reset it to the uppercase version. Code to do so as follows:

<script>
$('div').each(function(k, element)
{
    $(element).text( $(element).text().toUpperCase() );
});
</script>

An alternative is to also use CSS:

<style>
div { text-transform: uppercase; }
</style>

You could use css-

div{text-transform:uppercase}

You can set it per id.

<div id="textDiv">
...
</div>

$("#textDiv").text().toUpperCase();

What about:

$('div').each(function() {
    $(this).html($(this).text().toUpperCase());
});