Hi I made a loaded page but it's giving me an error and I'm not sure from what so I came here to ask if you know what caused it. Error message:

ERROR in src\components\pages\Bookings.js Line 24:12: Parsing error: Adjacent JSX elements must be wrapped in an enclosing tag. Did you want a JSX fragment <>...</>? (24:12) Code:

import React, { Component } from "react";
//just initialised but will have to get rid of css later

function click() {
    window.onload = function(){
        if(document.getElementById("ArtsButt").onclick) {
            window.open("link 1");
        }
        if(document.getElementById("SciButt").onclick) {
            window.open("link 2");
        }
        if(document.getElementById("EveButt").onclick) {
            window.open("link 3");
        }
    }
}


class Bookings extends Component {
    render() {
        click();
        return (
            <button type="button" id="ArtsButt">Arts</button>
            <button type="button" id="SciButt">Sciences+Eng</button>
            <button type="button" id="EveButt">Evening</button>
        )
    }
}

export default Bookings;

If you know how to fix this please let me know and thanks