JSFiddle - React, Tailwind, and code Playground
by zachreynolds
HTML
<div class="feed_entry"><h3><a href="https://www.reddit.com/r/news/comments/80voxz/dicks_major_gun_retailer_will_stop_selling/" target="_blank">Dick’s, Major Gun Retailer, Will Stop Selling Assault-Style Rifles</a></h3> <div class="content"> submitted by <a href="https://www.reddit.com/user/escapefromelba"> /u/escapefromelba </a> <br> <span><a href="https://nytimes.com/2018/02/28/business/dicks-major-gun-retailer-will-stop-selling-assault-style-rifles.html?smid=tw-nytimes&amp;smtyp=cur&referer=https://www.thedailybeast.com/dicks-sporting-goods-will-no-longer-sell-assault-style-guns">[link]</a></span> <span><a href="https://www.reddit.com/r/news/comments/80voxz/dicks_major_gun_retailer_will_stop_selling/">[comments]</a></span> </div><h3><a href="https://www.reddit.com/r/news/comments/80s452/parkland_father_admits_to_doctoring_cnn_email/" target="_blank">Parkland Father Admits to Doctoring CNN Email</a></h3> <div class="content"> submitted by <a href="https://www.reddit.com/user/fatcIemenza"> /u/fatcIemenza </a> <br> <span><a href="https://www.thedailybeast.com/parkland-father-admits-to-doctoring-cnn-email">[link]</a></span> <span><a href="https://www.reddit.com/r/news/comments/80s452/parkland_father_admits_to_doctoring_cnn_email/">[comments]</a></span> </div><h3><a href="https://www.reddit.com/r/news/comments/80x9td/nfl_names_pizza_hut_as_its_new_official_pizza/" target="_blank">NFL names Pizza Hut as its new official pizza sponsor.</a></h3> <div class="content"> submitted by <a href="https://www.reddit.com/user/Space_Lord-"> /u/Space_Lord- </a> <br> <span><a href="http://www.nfl.com/news/story/0ap3000000917911/article/nfl-names-pizza-hut-as-its-new-official-pizza-sponsor">[link]</a></span> <span><a href="https://www.reddit.com/r/news/comments/80x9td/nfl_names_pizza_hut_as_its_new_official_pizza/">[comments]</a></span> </div><h3><a...
CSS
.mm {background:#f00;margin:10px 0px 0px 0px;padding:5px 5px 5px 5px}
.rssFeed, .rssFeed * {
text-align: left;
font-weight: 400;
}
.rssFeed, .rssFeed * {
text-align: left;
font-weight: 400;
}
.rssFeed .rssFeedTitle {
clear: both;
}
.rssFeed{background:rgba(0,0,0,0.5);padding:10px;}
.wrappedtext {margin: -22px 0px 0px 5px}
JavaScript
$("h3").each(
function (index) {
$(this).nextUntil("h3").addBack().wrapAll("<div class='mm'></div>");
});
$(function() {
var test = $('.content')
.contents()
.filter(function() {
return this.nodeType === 3 && $.trim(this.nodeValue) !== '';
})
.wrap('<div class="wrappedtext" />');
});
$(function() {
$('.wrappedtext:contains("subm")').css('display', 'none');
});
$(function() {
$('.wrappedtext').filter( function(){ return $(this).text().length>100; } ).css({"margin": " 0px 0px -5px 0px", "background": "#f00", "padding":"5px"});
});
/*
$('.rssFeed').each(function() {
var data = [];
$(this).contents().each(function() {
if ( this.nodeType === Node.TEXT_NODE ) {
data.push(this);
}
}).end().append( $('<div class="red" />').append(data) );
});
*/