My function that changes state is not rerendering the page [react]

My state looks like:

const [profileList, setProfileList] = useState([]);

function looks like:

const getFriends = async () => {
    await axios
        .get(APICallString + id)
        .then((response) => {
            (async () => {
                let p = [];
                for await (const e of response.data) {
                    axios
                        .get(
                            "http://localhost:3002/persons/getById/" +
                                e.friendId
                        )
                        .then((response) => {
                            p.push(response.data);
                        })
                        .catch((error) => {
                            console.log(error);
                        });
                }
                console.log(p);
                setProfileList(p);
            })();
        })
        .catch((error) => {
            errMsg = error.message;
            console.log(error);
        });

    setLoaded(true);
};

Button:

<Button className="p-2 border" onClick={() => getFriends()}>
    Search
</Button>

The function works as expected, when I change state by typing in my textbox... but it doesnt change state its self.

Why?