Question: I have the following HTML:

```
<div class="row">
<div class="fourcol "> <a class="getNote" id="1" href="#">Create a Skybox</a> </div>
<div class="fourcol "> <a class="getNote" id="2" href="#">Add images to sky box</a> </div>
<div class="fourcol last"> <a class="getNote" id="3" href="#">Delete a sky box</a> </div>
<div class="row">
    <div class="twelvecol noteDetails"></div>
</div>
<div class="fourcol "> <a class="getNote" id="4" href="#">Change a skybox</a> </div>
<div class="fourcol "> <a class="getNote" id="5" href="#">Cool a skybox</a> </div>
<div class="fourcol last"> <a class="getNote" id="6" href="#">Hey a skybox</a> </div>
<div class="row">
    <div class="twelvecol noteDetails"></div>
</div>
<div class="fourcol "> <a class="getNote" id="7" href="#">one more</a> </div>
<div class="row">
    <div class="twelvecol">
        <div class="noteDetails"></div>
    </div>
</div>

```

How do I select the first div with noteDetails class?

I have tried:

```
$('#1').closest("div.noteDetails").html('test');

```

but it doesn't work.

Edit: What I really want to do is for example if I click on the link with id 4 then I want to update the closest .noteDetails (which in this case is the second .noteDetails)

Answer: 
What you are asking for is actually a little more difficult because of the way you have your HTML setup. You are also missing a lot of closing tags here...

Its much easier to search for things if they are direct siblings. Adding another class on the `.row` divs that contain the details like a `class="row rowDetails"` will make this a little easier.

This would find the next one using your current HTML though.

```
$( "a.getNote" ).click( function( event ) {
    // traverse up to the "row"
    var noteDetails = $( this ).closest(".row")
    // find the next siblings that contain a .noteDetails
            .nextAll().has( ".noteDetails" )
    // limit to the first match
            .first()
    // and then find the .noteDetails it contained
            .find(".noteDetails");
});

```

If you were to change the HTML as I suggested, you can replace the `.nextAll().has( ".noteDetails" )` with `.nextAll( ".rowDetails" )` instead. Using a class for a selector to `nextAll()` will be much faster than having to filter with [`.has()`](http://api.jquery.com/has).
Try this:

```
$("#1").next(".noteDetails").html("test");

```