Add html if value label is something

Question

i have a login page and i want customize it... the page is created by other code, so i want customize with jquery adding an external file. In this case i want do add a string before a login form, and so BEFORE the label where value is username...

But doesn't work...

    if($('label').val()== "Username*"){
         $(this).before('<h1>Effettua il login:</hi><br>');
      }

This is jsfiddle code: http://jsfiddle.net/fw6nong1/2/

Answer 1

You can select the label by its for attribute.

  var linkelimina = self.location.href; $(document).ready(function () { var link = self.location.href; if (link == linkelimina || link == "http://www.webisite.com/user" || link == "http://www.website.com/user/password") { $('.tabs').css('display', 'none'); $('.description').css('display', 'none'); $('label[for="edit-name"]').before('<h1>Effettua il login:</hi><br>'); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="section"> <a id="main-content"></a> <div class="tabs"> <h2 class="element-invisible">Primary tabs</h2> <ul class="tabs primary"> <li><a href="/user/register">Create new account</a> </li> <li class="active"><a class="active" href="/user">Log in<span class="element-invisible">(active tab)</span></a> </li> <li><a href="/user/password">Request new password</a> </li> </ul> </div> <div class="region region-content"> <div class="block block-system" id="block-system-main"> <div class="content"> <form accept-charset="UTF-8" id="user-login" method="post" action="/user"> <div> <div class="form-item form-type-textfield form-item-name"> <label for="edit-name">Username <span title="This field is required." class="form-required">*</span> </label> <input type="text" class="form-text required" maxlength="60" size="60" value="" name="name" id="edit-name"> <div class="description">Enter your website username.</div> </div> <div class="form-item form-type-password form-item-pass"> <label for="edit-pass">Password <span title="This field is required." class="form-required">*</span> </label> <input type="password" class="form-text required" maxlength="128" size="60" name="pass" id="edit-pass"> <div class="description">Enter the password that accompanies your username.</div> </div> <input type="hidden" value="form-l7DnfqR5ZJej8oGkHS8x_9YmAzOYnFX0qxiuSxY5XZI" name="form_build_id"> <input type="hidden" value="user_login" name="form_id"> <div id="edit-actions" class="form-actions form-wrapper"> <input type="submit" class="form-submit" value="Log in" name="op" id="edit-submit"> </div> </div> </form> </div> </div> </div> </div> 

Answer 2

See this JSFiddle:

I replaced your code with

$("label:contains('Username')").before('<h1>Effettua il login:</hi><br>');

EDIT

$("label[for='edit-name']").before('<h1>Effettua il login:</hi><br>');

Also works fine, just replace the selector with something unique for the label containing "Username *"

Answer 3

To filter it by text, you can use:

$("label").filter(function(){
    return $.trim($(this).text()) === "Username"; // trimming text because you have extra space
}).before('<h1>Effettua il login:</hi><br>');