JSFiddle - React, Tailwind, and code Playground

HTML

<div class="visible-content">
    <div class="information">1</div>
</div>

<div class="visible-content">
    <div class="information">2</div>
</div>

<div class="visible-content">
    <div class="information">3</div>
</div>

<!-- other content -->

<div class="other-content">
    <h1>Other content</h1>
    <div class="information-from-visible-content"></div>
</div>

CSS

div.visible-content { display:none; }

.other-content { float:left; margin:0px 0px; width:100px; height:100px; background:red; }
.other-content h1 { float:left; margin:0px 0px; font-size:12px; }

JavaScript

var divs = $("div.visible-content").get().sort(function(){ 
  return Math.round(Math.random())-0.5;
}).slice(0,1)
$(divs).show();

$(".information-from-visible-content").html($(divs).html());

$(divs).hide();