Insertar elementos HTML

Especificaciones del problema:

  1. Dos divs con dos párrafos descendientes a cada div.
  2. Al mismo nivel que los divs se localiza una lista ordenada, con 3 elementos.
  3. Se deben implementar los siguientes estilos de css:
    1. A los párrafos contenidos en los divs inmediatos se les define un borde superior azul y uno inferior blanco a excepción del primer párrafo el cual no debe presentar el borde superior y el último párrafo no debe presentar el borde inferior.
    2. A los párrafos recien agregados se les debe aplicar una clase que los resalte para diferenciarlos de los párrafos adyacentes.
    3. Los elementos en lista deben presentar el estilo mostrado en el imagen del ejemplo.
    4. Los links a agregar deben presentar un estilo mostrado en la imagen del ejemplo. Si el alumno lo desea también puede implementar los estilos cuando el link se encuentra en hover y visited.
  4. Se crean las funciones de jQuery con sus mecanismos de acción.
    1. Método que agrega un párrafo al final de cada div contenido en div.result, sin olvidar aplicar las reglas de estilo referentes a los párrafos. La segunda parte del método es que una vez que se agrega el link al div, cada vez que se llame a la función que agrega nuevos párrafos el link debe permanecer al final del div, como se muestra en la imagen de ejemplo.
    2. Método que agrega un link con el texto "Leer más" al final de cada div descendiente al div.result. El método permite agregar únicamente un link por div.
    3. Método que agrega un elemento de lista a la lista descendiente al div.result. Si el alumno cree conveniente aplicar un estilo de CSS que resalte a cada elemento de lista agregado se debe comentar en el código dicha tarea.
    4. Método que realiza las mismas funciones que el primer método, utilizando los métodos each(), after() y append(). También debe satisfacer los requerimientos de la segunda parte del método.
    5. Método que agrega un texto antes de los primeros párrafos descendientes a un div que a su vez descienda de un elemento con clase "result".
    6. Método que realiza la misma función que el segundo método, es decir que agrega un link con el texto "Leer más", pero utilizando el método after().

Resultado de aplicar las funciones requeridas.

Imagen del resultado del problema

Resultado del ejercicio

Manipular HTML en result

Lorem ipsum ad his scripta blandit partiendo

Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id.

Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos.

Ius id vidit volumus mandamus, vide veritus democritum te nec, ei eos debet libris consulatu. No mei ferri graeco dicunt, ad cum veri accommodare.

Sed at malis omnesque delicata, usu et iusto zzril meliore. Dicunt maiorum eloquentiam cum cu, sit summo dolor essent te.

  1. Ea mei nullam facete
  2. Ea mei nullam facete
  3. Ea mei nullam facete