How do I change the text of a div when I hover over a button?

Edited to fit OP’s request to change content of a singular box based on hover of other boxes. Using the general sibling combinator, we can select a div with the class results when a box is hovered.

JSFiddle Demo

HTML

<div class="container">
    <div class="box1">1</div>
    <div class="box2">2</div>

    <div class="results"></div>
</div>

CSS

.box1, .box2 { display: inline-block; width: 100px; height: 100px; background: #ccc; }

.results {
    width: 250px;
    height: 100px;
    background: #ccc;
    margin-top: 4px;
}

.box1:hover ~ div.results:before {
    cursor: pointer;
    content: "Hello";
}

.box2:hover ~ div.results:before {
    cursor: pointer;
    content: "World";
}

Using the General Sibling Combinator.