JSFiddle - React, Tailwind, and code Playground

by reygonzales

HTML

<div class="icons"> 
        <span class="attMessage"></span> 
        <span class="successMessage"></span> 
        <span class="errorMessage"></span> 
    </div> 
 
    <div class="newSection"> 
        <h3>Add/Update Adjuster License</h3> 
        <p>(this is where i am appending an icon from above)</p> 
        <p><a title="Add license to queue" class="addLicense">asdfdsasdfdsa</a></p>   
    </div>

JavaScript

$('.addLicense').click(function () { 
    var parent = $(this).parent(); 
    var license = $('.licenseOverview'); 
    var dropdown = $('#MainContent_ddlLicenseStates').val(); 
    var number = $('#MainContent_txtLicenseNumber').val(); 
    if (number != '') {             
        notifier(parent, "License Added To Queue", "Success"); 
        $('#MainContent_txtLicenseNumber').val(''); 
    } 
    else { 
        notifier(parent, "Must Enter A License Number", "Failure"); 
    } 
}); 
 
function notifier(oAppend, oMessage, oMessageType) { 
var iconDiv = $('.icons'); 
if (oMessageType == 'Success') { 
  $('.icons > .successMessage').clone().html(oMessage).appendTo(oAppend).delay(100).fadeIn('slow').delay(500).fadeOut(); 
//tried a different way since i thought clone was crashing ie9         
//$('.icons > .successMessage').html(oMessage).appendTo(oAppend).delay(100).fadeIn('slow').delay(500).fadeOut(); 
    setTimeout(function () { oAppend.find('.successMessage').remove().appendTo(iconDiv); }, 2500); 
} 
else if (oMessageType == 'Failure') { 
    $('.icons > .errorMessage').clone().html(oMessage).appendTo(oAppend).delay(100).fadeIn('slow').delay(500).fadeOut(); 
    setTimeout(function () { oAppend.find('.errorMessage').remove() }, 2500); 
 
} 
else if (oMessageType == 'Warning') { 
    $('.icons > .attMessage').clone().html(oMessage).appendTo(oAppend).delay(100).fadeIn('slow').delay(500).fadeOut(); 
    setTimeout(function () { oAppend.find('.attMessage').remove() }, 2500); 
 
    } 
}