JSFiddle - React, Tailwind, and code Playground

HTML

<div class="alignleft top-title-catchphrase">
  <!-- サイトのタイトル -->
  <p id="site-title" itemscope="" itemtype="http://schema.org/Organization">
    <a href="#">blazechariot-cloud9-</a></p>
  <!-- サイトの概要 -->
  <p id="site-description">
    Just another WordPress site</p>
</div>

CSS

/*
タグで囲んだ場合(brの時は不要)。
改行させるためにdisplay: blockにする
*/

#site-description .front,
#site-description .rear {
  display: block;
}

JavaScript

/*
//brでやる場合part1
(function($){
	$(function(){
  	var 
    sd = $("#site-description"),
    str = sd.text(),
    sepalate = "WordPress"; //区分けるワード
    
    var
    splitStr = str.split(sepalate),
    front = splitStr[0] + "<br>",
    rear = sepalate+" "+splitStr[1]; //+" "+の部分は半角スペース用

    sd.html(front+rear);
  });
})(jQuery);
*/


//brでやる場合part2
(function($){
	$(function(){
  	var 
    sd = $("#site-description"),
    str = sd.text();
    sd.html(str.replace(/Word/,"<br>$&"));
  });
})(jQuery);


/*
//それぞれを何かしらのタグで囲む場合
(function($){
	$(function(){
  	var 
    sd = $("#site-description"),
    str = sd.text(),
    sepalate = "WordPress"; //区分けるワード
    
    var
    splitStr = str.split(sepalate),
    front = "<span class='front'>"+splitStr[0]+"</span>",
    rear = "<span class='rear'>"+sepalate+" "+splitStr[1]+"</span>";

    sd.html(front+rear);
  });
})(jQuery);
*/