title: How to extract Value of a class based on the color of adjacent div?
body: <p>I am working on a webscrapping project. Have difficulty getting the text of an element with green progress bar. I have attached the html for your reference. I need the progress bar title if adjacent progress bar color is green.</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="progressbar-warp"&gt;
    &lt;span class="progressbar-title"&gt;
                                                  ATTLIST
                                              &lt;/span&gt;
    &lt;div class="progressbar"&gt;
      &lt;div data-percent="]\\\\\\\\\\\\\\\\\\\\\\'kj;hb p7-yh " class="progressbar-percent" style="background-color: green; width: 100%;"&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;span class="progressbar-title"&gt;
                                                  None of the mentioned
                                              &lt;/span&gt;
    &lt;div class="progressbar"&gt;
      &lt;div data-percent="100" class="progressbar-percent" style="width: 100%;"&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;span class="progressbar-title"&gt;
                                                  XML
                                              &lt;/span&gt;
    &lt;div class="progressbar"&gt;
      &lt;div data-percent="100" class="progressbar-percent" style="width: 100%;"&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;span class="progressbar-title"&gt;
                                                  SGML
                                              &lt;/span&gt;
    &lt;div class="progressbar"&gt;
      &lt;div data-percent="100" class="progressbar-percent" style="width: 100%;"&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>