title: Change data-percent in js
body: <p>I'm trying to create a program in JS in order to change some data-percent when you click on a region of a map. Basically I'm using a jqvmap as Map and a progressbar to display some info for each region that the user clicks.
  that what I'm working with:</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;h1&gt;Edificable surface&lt;/h1&gt;
        &lt;div class="skillbar clearfix" data-percent="0%"&gt;
        &lt;div class="skillbar-title" style="background: #27ae60;"&gt;&lt;span&gt;Job&lt;/span&gt;&lt;/div&gt;
        &lt;div class="skillbar-bar" style="background: #2ecc71;"&gt;&lt;/div&gt;
        &lt;div class="skill-bar-percent"&gt;100%&lt;/div&gt;
        &lt;/div&gt; &lt;!-- End Skill Bar --&gt;
  </code></pre>
  
  <p>JavaScript</p>
  
  <pre><code>jQuery(document).ready(function(){
    jQuery('.skillbar').each(function(){
      jQuery(this).find('.skillbar-bar').animate({
        width:jQuery(this).attr('data-percent')
      },6000);
    });
  });
  
  jQuery(document).ready(function () {
          jQuery('#vmap').vectorMap({
            map: 'europe_en',
            enableZoom: false,
            showTooltip: true,
            onRegionClick: function (element, code, region) {
              if (!touch_detect()) {
                // we're not on a mobile device, handle the click
                var message = 'You clicked "' + region + '" which has the code: ' + code.toUpperCase();
                document.getElementById('indi').innerHTML = 'You clicked "' + region + '".';
              }
              if (region == 'United Kingdom') {
              document.getElementByClassName('skillbar clearfix').setAttribute('data-percent', '50%');
            } else {
              document.getElementByClassName('skillbar clearfix').setAttribute('data-percent', '0');
            }
            },
            onRegionOver: function (element, code, region) {
              if (touch_detect()) {
                /// we're not on a mobile device, handle the click
                var message = 'You clicked "' + region + '" which has the code: ' + code.toUpperCase();
                document.getElementById('indi').innerHTML = 'You clicked "' + region + '".';
              } 
          },
          });
        });  
  </code></pre>
  
  <p>the first if statement works properly and every time I click on a region it display the region that I have clicked but the second one ( if region = 'United Kingdom')..... " doesn't work even if it looks like correct.
  Do you have any tips for me?
  Thanks :)</p>