JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
      <li>
        <div class="title">
          <a class="title-a" href="#">Заголовок1</a>
          <span>11.11.2012 |</span><a href="#">Раздел: Новости чего-то</a>
        </div>
        <div class="body">Текст новости1</div>
      </li>
      <li>
        <div class="title">
          <a class="title-a" href="#">Заголовок2</a>
          <span>05.11.2012 |</span><a href="#">Раздел: Архив</a>
        </div>
        <div class="body">Текст новости2</div>
      </li>
      <li>
        <div class="title">
          <a class="title-a" href="#">Заголовок3</a>
          <span>03.11.2012 |</span><a href="#">Раздел: Новенькое</a>
        </div>
        <div class="body">Текст новости3</div>
      </li>
    </ul>

CSS

li {
    display: block;
    border: 1px solidd red;
}
.title {
    boder: 1px solid green;
    font-size: 12px;
}
.title-a {
    font-size: 14px;
    color: #ff00cc;
}

JavaScript

$(document).ready(function(){
        $(".body").hide();
        $(".title-a").click(function(){
            $(this).closest("li").find(".body").slideToggle('slow');
            return false;
        });
    });