jQuery addClass example

Change class name on click in jQuery

by Good Muyis

HTML

<div id="wilcity-addlisting-contact_info" class="content-box_module__333d9 content-box_lg__3v3a-">
  <div class="content-box_body__3tSRB">
    <div class="">
      <div class="field_module__1H6kT field_style2__2Znhe mb-15 active" target="email">
        <div class="field_wrap__Gv92k">
        <input type="email" class="field_field__3U_Rt" value="hello"> 
        <span class="field_label__2eCP7 text-ellipsis">Email</span> <span class="bg-color-primary"></span></div>
        <!---->
      </div>
    </div>
    <div class="">
      <div class="field_module__1H6kT field_style2__2Znhe mb-15">
        <div class="field_wrap__Gv92k"><input type="text" class="field_field__3U_Rt"> <span class="field_label__2eCP7 text-ellipsis">Phone</span> <span class="bg-color-primary"></span></div> <span class="field_message__3Z6FX color-quaternary"></span>
      </div>
    </div>
    <div class="">
      <div class="field_module__1H6kT field_style2__2Znhe mb-15" target="website">
        <div class="field_wrap__Gv92k"><input type="url" class="field_field__3U_Rt"> <span class="field_label__2eCP7 text-ellipsis">Website</span> <span class="bg-color-primary"></span></div>
        <!---->
      </div>
    </div>
  </div>
</div>

CSS

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

JavaScript

jQuery('.wilcity-addlisting-contact_info').ready(function(){
	//if ( !null()){	}
	jQuery('.wilcity-addlisting-contact_info input[type=email]').val('[email protected]');
	jQuery('.wilcity-addlisting-contact_info input[type="text"]').val('08070985576');
	jQuery('.wilcity-addlisting-contact_info input[type="url"]').val('https://ultimatenigeria.com');
	var testVal = jQuery("[target='email'] input ").val(); 
	alert("testVal: "+testVal);

//end of ready() function;    
})