JSFiddle - React, Tailwind, and code Playground

by Daniel Mocan

HTML

<div class='div1'> This is some text and will be long.This is some text and will be long.This is some text and will be long.This is some text and will be long.
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

CSS

.div1{
    width: 200px;
    height: 40px;
    overflow: scroll;
    white-space:nowrap;
}
.divfull {
    width: 250px; 
    margin-bottom: 10px;
}

JavaScript

var $div1 = $(".div1");
$div1.on("click mouseover", function(){
	$(this).removeClass("div1").addClass("divfull");
});