I like to have my arrow (which i toggle on click) next to my headertext.  

I tried to put the arrow `<div>` into the H1 tag, but the toggle doesn't work then.  

Could someone help me?  

I prefer you add the edited snippet to your answer

```js
$('a[id^="module-tab-"]').click(function() {
  $(this).next('.hi').toggleClass("left-image right-image");
});
```

```css
.left-image {
  background-image: url('http://i.stack.imgur.com/euD9p.png');
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
}
.right-image {
  background-image: url('http://i.stack.imgur.com/dzs9m.png');
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
}
```

```html
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<table>
  <tr style='background-color: lightgray; min-height: 200px;'>
    <td colspan='10'>
      <a href='#' id='module-tab-1' class='toggler' data-prod-cat='1'><h1 style='margin-bottom: 0px;'> Gearchiveerde Storingen </h1></a>
      <div class='left-image hi'></div>
    </td>
  </tr>
</table>
```