CODEWITHSUNDEEP
jqueryjquery-selectors
rahularyansharma
rahularyansharma

Reputation: 10775

How can I remove border of all child elements of a parent div using jquery?

I am facing a problem that I want to remove all child elements border of a container div using jQuery.

Child elements can be image, div, p tag, or anchor or any HTML tag.

Here's my try:

$(document).ready(function (){
    $("#div1").children("div").css("border","0px solid red");
});

jsfiddle link

Upvotes: 1

Views: 3697

Answers (4)

Teun Pronk
Teun Pronk

Reputation: 1399

for all children it will be $("#div1").children().css("border", "0");

But if you add the borders by the style attribute like you did before you could also go for

$("#div1").children().removeAttr("style");

Hope this helps

Upvotes: 0

jonas_jonas
jonas_jonas

Reputation: 444

Well, that's easy:

$("#div1 *").css({
    border: "none"
});

Or if you have a jquery-object of your parent:

var $div = $("#div1");
$div.find("*").css({
    border: "none"
});

If you know that you just want to remove borders from div-elements instead of all elements inside, just use:

var $div = $("#div1");
$div.find("div").css({
    border: "none"
});

Upvotes: 0

Filip
Filip

Reputation: 2522

Change children to find, like this.

$(document).ready(function (){
    $("#div1").find("*").css("border", "0");
});

And here's the fiddle: http://jsfiddle.net/Yu25h/

Upvotes: 6

karim79
karim79

Reputation: 342715

The all selector?

$("#div1").find("*").css("border","0");

Upvotes: 0

Related Questions