JSFiddle - React, Tailwind, and code Playground

by Andres Abadia

HTML

<body class="some-id">
  <div>
    <a href="#"><span>some text</span></a>  
  </div>
  <div>
    <a href="#">some other text</a>  
  </div>
  <div>
    <a href="#"><img src="https://www.gravatar.com/avatar/e00caaaf24760fe4a1626c6d9edf697d?s=64" alt=""></a>  
  </div>  
  <div>
    <a href="#"><img src="https://www.gravatar.com/avatar/e00caaaf24760fe4a1626c6d9edf697d?s=64" alt=""><span>some text after img</span></a>  
  </div>  
</body>

CSS

a{
  text-decoration: none;
  color: black;
}
a.edge-bottom-border:hover{
  border-bottom: 0.1em solid red;
}

JavaScript

jQuery(document).ready(function(){
	var links = jQuery('body.some-id a');
  links.each(function(){
  	var t = jQuery(this);
  	//console.log(t);
  	if(t.text()){
    	t.addClass('edge-bottom-border');
      console.log(t.text());	
    }  	
  })
	
})