Question: I have this example of Collapse row on mouse click:

```
jsfiddle.net/7bz5au97/

```

I would like to ask you how I can add arrow like this one at the beginning of the question and rotate it when the question is expanded?

![enter image description here](https://i.stack.imgur.com/nKYFI.png)

Can this be done with CSS only or I need also to add JavaScript?

Answer: 
Here is an update of your jsfiddle <https://jsfiddle.net/7bz5au97/1/>

I just added 

```
$('body').click(function() {
$( 'img' ).toggleClass('rotate');
});

```

and rotate to the img
A Simple CSS Only Solution without Images
-----------------------------------------

Requirement:
*"I would like to ask you how I can add arrow like this one at the beginning of the question and rotate it when the question is expanded?"*

For simple popup information like this, one could just do it all with CSS ... without any scripting. And unicode arrows ▶ would work in place of loading images and doing image transforms. I'm just tossing this in as one alternative.

**Run the Snippet to Test**

```html
<!doctype html>
<html>
<body>
<style type="text/css">
ul {
 list-style: none;
 font-size: 16px;
 font-family: sans-serif;
}
li::before {
 content: "▶ ";
 font-size: 1.2em;
}
li:hover::before {
 content: "▼ ";
 color: red;
}
li > div {
 margin: 0.5em;
 display: none;
}
li:hover > div {
 display: block;
 height: 5em;
 width: 20em;
 border: 1px gray dotted;
 padding: 1em;
 background-color: ghostwhite;
}
</style>
<b>Example</b>
<ul>
<li>Q1: Can I try the software before I buy it?
<div>
 Yes! Simply download a free trial and you'll have 
 instant access to all features for 30 days, absolutely 
 free. We don't require your credit card details or any 
 commitment.
</div>
<li>Q2: Can I try the software before I buy it?
<div>
 Yes! Simply download a free trial and you'll have 
 instant access to all features for 30 days, absolutely 
 free. We don't require your credit card details or any 
 commitment.
</div>
<li>Q3: Can I try the software before I buy it?
<div>
 Yes! Simply download a free trial and you'll have 
 instant access to all features for 30 days, absolutely 
 free. We don't require your credit card details or any 
 commitment.
</div>
</ul>
</body>
</html>
```