Question: I'd like to remove an `id` from an image after its animation is completed. I have this in my code:

```
if(index == 1 && direction =='down'){
    $('#slidetext1 #rock').animate({right:"0"});
    $('#slidetext1 #deer').animate({left: "0"}).addClass('open').removeAttr('id');
}

```

It's not working because it removes the id before even starting the animation, but what I want to do is to remove the `id` #deer from the image and add ('open') after the `.animate()` has been executed.

so here i made a jsfiddle: <http://jsfiddle.net/67oe1jvn/45/> . pay attection to the left image as you scroll down under the HELLO h1. the thing i want to achive is: when i get to the second section, i'd like to see both of the images slide in the view with the directive "transition:all 1.2s ease-out;" AND whenever the section gets changed make them slide out of the view with a faster transiction, so it won't been noticed that much.

Answer: 
The URL you use in your example seems to be incomplete: it should read ...`interpreter?data=[out:json]`.... i.e. the **data=** part was missing.

As a reference you can also put your query in overpass turbo and simply click on Export -> raw data directly from Overpass API to get to a working URL. Maybe try this first with wget and if it works out ok, put the URL in your Javascript code.

Maybe you also want to study a bit, how overpass turbo does the (POST-based) calls to Overpass API: please see <https://github.com/tyrasd/overpass-turbo/blob/master/js/overpass.js#L581> for details.
Without a library, we have to `POST` a query formatted in [OverpassQL](https://wiki.openstreetmap.org/wiki/Overpass_API/Overpass_QL).

This example will retrieve restaurants into a rather small bounding box *bottom\_left/top\_right* `48.865,2.25,48.9,2.27` somewhere in Paris.

```js
(async () => {
  const api = await fetch('https://www.overpass-api.de/api/interpreter?', {
    method: 'POST',
    headers: {
      'Accept': 'application/json',
      'Content-Type': 'application/json'
    },
    body:"[out:json];node(48.865,2.25,48.9,2.27)[amenity=restaurant];out;"
  });
  const answer = await api.json();
  console.log(answer);
})()
```

[List of `amenity` keys](https://wiki.openstreetmap.org/wiki/Key:amenity) matching most common POI like *pharmacy, parking, veterinary* ...

---

This API is easily overloaded, we have to pass in smalls areas, and we better have to use a timeout. Unexpected errors are common, we have to handle them in our apps.

But warning the error response is not in JSON, but in XML, could require some try/catch over a [XMLparser](https://developer.mozilla.org/en-US/docs/Web/Guide/Parsing_and_serializing_XML).

EQ:

> 
> Error: runtime error: open64: 0 Success /osm3s\_v0.7.58\_osm\_base
> Dispatcher\_Client::request\_read\_and\_idx::timeout. The server is
> probably too busy to handle your request.
> 
> 
> 

Examples complex queries in the overpassQL language <https://wiki.openstreetmap.org/wiki/Overpass_API/Overpass_API_by_Example>