JSFiddle - React, Tailwind, and code Playground

by rogeriolino

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
<p>Aenean congue, urna vitae mollis placerat.</p> 
<p>Quisque congue dignissim lectus et suscipit.</p> 
<p>Suspendisse vehicula in arcu non gravida.</p> 
<p>Nunc dui orci, egestas vel tempor vel, aliquam vel nibh.</p> 
<p>Aliquam quis euismod libero.</p> 
<p>Maecenas rhoncus facilisis nunc sit amet accumsan.</p> 
<p>Nullam ultricies placerat lectus, id laoreet nibh molestie at.</p> 
<p>Morbi turpis eros, suscipit a ex at, placerat feugiat tellus.</p>

CSS

body {
    padding: 2em;
}

.highlight {
    background: yellow;
}

JavaScript

$('p:even').css('color', 'gray');

$('p')
    .on('mouseover', function () {
        $(this).addClass('highlight');
    })
    .on('mouseout', function () {
        $(this).removeClass('highlight');
    });