JavaScript HTML文字列からstyleタグ内のテキストを取得したい

Question

JavaScript HTML文字列からstyleタグ内を取得したいです

以下のようなHTMLから

<p style="color:red;">aaa</p> 

<style>.blue { color:blue; }</style> 
<p class="blue">aaa</p> 

<p>aaa</p> 

<style>.yellow { background:yellow; }</style> 
<p class="yellow">aaa</p>

scriptタグ内の文字のみを取得したコード

.blue { color:blue; } .yellow { background:yellow; }

を取得したいです

試してみたこと

この記事を参考にstyleタグを取得してみました
https://qiita.com/yut-nagase/items/0f4aab256e38bb72068a

var str = `<p style="color:red;">aaa</p> 

<style>.blue { color:blue; }</style> 
<p class="blue">aaa</p> 

<p>aaa</p> 

<style>.yellow { background:yellow; }</style> 
<p class="yellow">aaa</p>`;

var tag_val="style";

//動的に正規表現パターンを生成するには「RegExp」を使用します。
var pattern1 = new RegExp("<"+tag_val+"(?: .+?)?>.*?<\/"+tag_val+">", "g"); 
var result = str.match(pattern1);
console.log(result);

しかしresultはnullが返ってきてしまいます

お心優しい方、助言いただけると幸いです。