Want to Hide a span element using class selector using CSS

indian143

Hi All, I want to hide span which has class k-icon k-i-close but don't want to hide spam with class: k-icon k-i-edit,

[Edit](#)


	
[Delete](#)

I have tried in the below way:

.k-button.k-button-icontext .k-icon, .k-button.k-button-icontext .k-image
{
visibility:hidden;
}

But it is hiding images of all buttons, but I want to only hide delete buttons image using css class. I have tried in the below way also but its not hiding the delete buttons icon, I just want to hide the delete buttons icon.

function dataBoundAdmin(e)
{
var data = this.dataSource.view();
for (var i = 0; i < data.length; i++)
{
var uid = data[i].uid;
var row = this.table.find("tr[data-uid='" + uid + "']");

    if (data\[i\].IsValid)
    {            
        row.find(".k-grid-delete").contents().last()\[0\].textContent = 'Disable';
    }
    else
    {            
        row.find(".k-grid-delete").contents().last()\[0\].textContent = 'Enable';
    }
}

$(".k-icon k-i-close").hide();

}

Any help is going to be very helpful, thanks in advance. Thanks, Abdul Aleem "There is already enough hatred in the world lets spread love, compassion and affection."

indian143

Ok no problem, I got it resolved in the following way:

function dataBoundAdmin(e)
{
var data = this.dataSource.view();
for (var i = 0; i < data.length; i++)
{
var uid = data[i].uid;
var row = this.table.find("tr[data-uid='" + uid + "']");

    row.find(".k-i-close").hide();

    if (data\[i\].IsValid)
    {            
        row.find(".k-grid-delete").contents().last()\[0\].textContent = 'Disable';           
    }
    else
    {            
        row.find(".k-grid-delete").contents().last()\[0\].textContent = 'Enable';            
    }
}

}

Just say if somebody needs similar help. Thanks, Abdul Aleem "There is already enough hatred in the world lets spread love, compassion and affection."

Richard Deeming

If you want to hide .k-i-close but not .k-i-edit, then you need a rule that targets .k-i-close:

.k-button.k-button-icontext .k-i-close
{
visibility:hidden;
}

If you want to do it using jQuery, you'll need a valid selector. Your example is looking for an element called <k-i-close> which is a descendant of an element with class="k-icon" - that doesn't match your markup. Try:

$(".k-icon.k-i-close").hide();

Class Selector (“.class”) | jQuery API Documentation[^]

"These people looked deep within my soul and assigned me a number based on the order in which I joined." - Homer