?
Solved

JQuery

Posted on 2013-10-23
8
Medium Priority
?
138 Views
Last Modified: 2013-10-23
I am trying to put an icon before a series of dom elements that contain a required select.  

For example, I have the following div structures:
<div class="1">
    <div class="2">
        <select class="required">
    </div>
</div>

<div class="1">
    <div class="2">
        <select>
    </div>
</div>

I need to place the required icon in front of <div class="1"> that contains <select class="required">.

When I tried to do that it placed it in front of all <div class="1"> instead of just the <div class="1"> containing the <select class="required">.

How do I get it to show up in front of just the divs that contain the required select?

Thanks!
0
Comment
Question by:cgjenkins
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 3
8 Comments
 
LVL 22

Expert Comment

by:Mrunal
ID: 39593871
Hi
Can you share more information like how it is currently looking and how exactly you want it to look?

also share css definition for "required" and all others.
0
 
LVL 30

Expert Comment

by:Alexandre Simões
ID: 39593896
Something like this?
$('select.required').closest('div.1').before('<img src="image url" />');

Open in new window

0
 

Author Comment

by:cgjenkins
ID: 39593899
Here is the script:
$('div.1').ready(function() {
    if ($('h5').children('select.required') && !$(this).next().is('span.required')) {
        $('div.1').before('<span class="required">&nbsp;</span>');

    }
});
0
WordPress Tutorial 3: Plugins, Themes, and Widgets

The three most common changes you will make to your website involve the look (themes), the functionality (plugins), and modular elements (widgets).

In this article we will briefly define each again, and give you directions on how to install them.

 
LVL 30

Expert Comment

by:Alexandre Simões
ID: 39593907
Be aware that the div might break the line.
If the image is related to the select you might also consider put it before (or after) the select itself:
$('select.required').before('<img src="image url" />');

Open in new window

0
 

Author Comment

by:cgjenkins
ID: 39593946
I have tried that, but the select is wrapped in two divs (I didn't create it, I just have to deal with it :) ), so the icon has to go outside of div.1.
0
 
LVL 30

Accepted Solution

by:
Alexandre Simões earned 2000 total points
ID: 39594043
So use my first option!
$('select.required').closest('div.1').before('<img src="image url" />');

Open in new window

0
 

Author Comment

by:cgjenkins
ID: 39594316
That one almost works.  However, if I have two div.1s with select.required, I get two icons outside of the first div.1 Instead of one outside of each div.1 that has a required select.  See two required icons
0
 

Author Closing Comment

by:cgjenkins
ID: 39594454
I resolved it with .each() :).  Thanks!
0

Featured Post

Independent Software Vendors: 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!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction Knockoutjs (Knockout) is a JavaScript framework (Model View ViewModel or MVVM framework).   The main ideology behind Knockout is to control from JavaScript how a page looks whilst creating an engaging user experience in the least …
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
Viewers will learn about basic arrays, how to declare them, and how to use them. Introduction and definition: Declare an array and cover the syntax of declaring them: Initialize every index in the created array: Example/Features of a basic arr…
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
Suggested Courses

764 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question