Question: How can I create an arc shape like this: 

![shape](https://i.stack.imgur.com/gZ24R.png)

With CSS or jquery or javascript

Answer: 
You don't even need CSS/JS to draw this. Just use an `<svg>` element.

```html
<svg width="270" height="120">
    <path
       d="M 49.155517,102.32765 C 127.54837,40.541934 209.51266,103.2205 209.51266,103.2205 l 0,0 C 259.33409,50.363364 259.15552,50.363364 259.15552,50.363364 126.68749,-56.114356 2.1861831,50.204194 2.1861831,50.204194 z"
       stroke-width="3"
       stroke="#A5423A"
       fill="none"
    />
</svg>
```
You could use SVG for this. There is an [arc path command](http://www.w3.org/TR/SVG/paths.html#PathDataEllipticalArcCommands) which you could use. 

As your comment states, you want to place content inside the arc and you want them to rotate. 

Content like text or image could be placed inside the svg. 
Rotation can be achieved with `transform=rotate(..)`. 

If you want to do more animations with SVG you could have a look at [D3.js](http://d3js.org/). If you just want to create some arcs, you possibly can do the math on your own for computing the SVG path string.