jQuery - my first program

this program selects and animates some tags on the page

HTML

<h1>Play around with Selectors</h1>

<p class="comment">Just edit the Javascript to try different things</p>

<div class="badge_holder" id="bh1" >

<img alt="First Lesson" src="http://cdn.codecademy.com/assets/badges/FirstLessonAchievement-d6f60dce83fd230140606858fa229197.png">

</div>

<div class="badge_holder" id="bh2" >
    
<img alt="10 Exercises" src="http://cdn.codecademy.com/assets/badges/Exercises10Achievement-8fe065bfa15675895bf4a12247bb84f4.png">
    
</div>

<div class="badge_holder" id="bh3" >
    
<img alt="25 Exercises" src="http://cdn.codecademy.com/assets/badges/Exercises25Achievement-9334fe27052146b42c1c4bbf582739ab.png">
    
    </div>

<div class="badge_holder" id="bh4">
    
<img alt="Getting Stated with Programming" src="http://cdn.codecademy.com/assets/badges/ProgrammingIntroCourseAchievement-d7b0199c9fa4dd92913afaaa82a4a099.png">
    
    </div>

<div class="badge_holder" id="bh5">
    
<img alt="50 Exercises" src="http://cdn.codecademy.com/assets/badges/Exercises50Achievement-fde588c9e7f0e215198ab3edbb5ad927.png">
    
    </div>

<div class="badge_holder" id="bh6">
    
<img alt="Functions in JavaScripts" src="http://cdn.codecademy.com/assets/badges/FunctionsInJavaScriptCourseAchievement-fc55dfb887fffacf3a62d72e6d5268a6.png">
    

    
</div>

CSS

.badge_holder {
    float: left;
    width: 114px;
    height: 114px;
    background-color: #ddd;
    margin: 10px;
    padding: 10px;
        border: 1px transparent solid;
}

.withBorder {
    border: 1px black solid;
}

JavaScript

// select by tagname
//        fade to half opacity
$('h1').fadeTo(900, 0.5);


// select by class="comment"
//        add some text in front of it
$('.comment').prepend("Brigitte says: ");

// select by id="bh1"
//        add a Class (see CSS)

$('#bh1').addClass('withBorder');

$('#bh2').addClass('withBorder');