Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 9150
  • Last Modified:

change border size of div using javascript

hi there,
is it possible to change the border size of a div using a javascript onclick event?
if so can I have an example?  
many thanks,
  • 4
  • 4
1 Solution
Try this:
<div style="border: black solid 1px;" onclick="this.style.borderWidth = '5px';">Test</div>
jimbona27Author Commented:
that works, my file is actually returned using ajax.

the parent that gets called needs this functionality.

the page as normal, simply viewing it directly this code works fine.

how can I place the javascript in the parental file that relates to the child?

many thanks
jimbona27Author Commented:
dont know if thats clear...?

i have page A

this calls page B

page B has the div I want to change the border width on click.

where can I place the javascript code if I want the code to be a function rather than inline?

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

I'm not sure I know what you mean with when page A calls page B. If it opens a new page and replaces the old page, then it can't run any code from page A. You could change the code so that it uses dom references and put it in a function.

function changeBorderWidth(elemID, width)
    document.getElementById(elemID).style.borderWidth = width;

etc. But you would still need to call changeBorderWidth from some where.
jimbona27Author Commented:
the problem im experiencing is that the dom loads as normal and grabs the elements in the page.

but after this more elements are introduced onto the page.

therefore, at this point i dont think the DOM knows about the new elements because they didnt exist before the ajax call when the DOM was initialised.

i.e. like putting new elements on a page and without refreshing the page trying to DOM the new elements.

does that help?
These new elements are on a new page or additions to the current page?

I don't think I have enough information for me to understand the exact situation yet. If the elements are rendered, I think they should be accessible by the DOM. I don't recall having a situation where I wasn't able to. Are you able to reference the new div element at all through javascript?

Even something simple like:

Or something just to see if it can be referenced.
Come code snippets might help too.
jimbona27Author Commented:
will send you code tomorrow, sorry for the delay.

Featured Post

Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

  • 4
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now