I have a bootstrap collapsible div:

```
<h3 data-toggle="collapse" data-target="#demo" class="collapse-button" collapse>
      simple collapsible
    </h3>
    <div id="demo" class="collapse">
      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptates dolor vel tenetur quod voluptate debitis nemo et mollitia dicta voluptas.
    </div>

```

They don't provide you of any built-in way to set a class on the collapsing element (here an H3) based on the status of the collapsed element. Their code just sets a class of "in" on the collapsed element when it's showing.

What I need to do is create a generalized way to set a class on the H3 so I can display the right icon next to it.

I figured I could use jQuery to detect if the child div has the class "in" or not.

So far, this has eluded me.

If I select the child div by name, it works:

```
$(function() {
 $('.collapse-button').on('click', function(event) {
   event.preventDefault();
   var isOpen = $('#demo').hasClass('in'); 
   alert(isOpen);
 });
});

```

But I want to use this handler for **any** H3 and child div combo, so I need to simple get the div thats the child of the object. So I tried things like

```
  $(this).find('div').hasClass('in');

```

To no avail. What am I missing here?